Java教程

mouseout和mouseleave的区别

本文主要是介绍mouseout和mouseleave的区别，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

mouseleave事件是各元素各自触发，不是由子元素冒泡而来，而mouseout是由子元素冒泡而来。

举个栗子

.app1 {
  width: 300px;
  height: 300px;
  border: 1px dashed black;
}
.app2 {
  width: 200px;
  height: 200px;
  border: 1px dashed gray;
  }
.app3 {
  width: 100px;
  height: 100px;
  border: 1px dashed lightgray;
}
/* 我把鼠标起点放在最里层 div 里往外移动到最外层 div 之外 */
//上述一整个过程 onm ouseleave 只会会打印一次
//而 onm ouseout 会打印三次，三层 div 由于子元素冒泡，导致打印事件发生了3次
<div class="app1" onm ouseleave="console.log('leave')">
  <div class="app2">
    <div class="app3"></div>
  </div>
</div>
这篇关于mouseout和mouseleave的区别的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！
您可能喜欢
栏目导航