脚本宝典收集整理的这篇文章主要介绍了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 之外 */
//上述一整个过程 onmouseleave 只会会打印一次
//而 onmouseout 会打印三次，三层 div 由于子元素冒泡，导致打印事件发生了3次
<div class="app1" onmouseleave="console.LOG('leave')">
  <div class="app2">
    <div class="app3"></div>
  </div>
</div>

脚本宝典总结

以上是脚本宝典为你收集整理的mouseout和mouseleave的区别全部内容，希望文章能够帮你解决mouseout和mouseleave的区别所遇到的问题。

如果觉得脚本宝典网站内容还不错，欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。