浅谈JQ中mouseover和mouseenter的区别

mouseenter事件只会触发一次，触发对象是注册对象或者注册对象的子元素
mouseover事件可以触发多次，触发对象是注册对象或者注册对象的子元素

<！DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Document</title></head><body><p>不论鼠标指针穿过被选元素或其子元素，都会触发 mouseover 事件。</p> <p>只有在鼠标指针穿过被选元素时，才会触发 mouseenter 事件。</p> <div class="over" style="background-color:lightgray;padding:20px;width:40%;float:left"> <h2 style="background-color:white;">被触发的 Mouseover 事件：<span></span></h2> </div> <div class="enter" style="background-color:lightgray;padding:20px;width:40%;float:right"> <h2 style="background-color:white;">被触发的 Mouseenter 事件：<span></span></h2> </div> <script>var x = 0,y = 0;var div1 = document.getElementsByClassName（"over"）[0];div1.addEventListener（"mouseover",function（）{var span = this.getElementsByTagName（"span"）[0]span.innerText = （x +=1）;span.style.cssText = "border:2px red solid;";},false）;var div2 = document.getElementsByClassName（"enter"）[0];div2.addEventListener（"mouseenter",function（）{var span = this.getElementsByTagName（"span"）[0]span.innerText = （y +=1）;span.style.cssText = "border:2px red solid;";},false）;</script></body></html>

以上这篇浅谈JQ中mouseover和mouseenter的区别就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。