Question

mouseover和mouseenter事件的区别

Answer 1

不论鼠标指针穿过被选元素或其子元素，都会触发 mouseover 事件。对应mouseout
只有在鼠标指针穿过被选元素时，才会触发 mouseenter 事件。对应mouseleave

这样的话，mouseenter子元素不会反复触发事件，否则在IE中经常有闪烁情况发生。

Answer 2

mouseenter事件在鼠标进入某个元素，或第一次进入这个元素的某个子元素时触发。一旦触发后，在mouseleave之前，鼠标在这个元素的子元素上触发mouseenter事件都不会触发这个元素的mouseenter事件。即：一旦进入，在子元素间的mouseenter不算是在本元素上的mouseenter。

而mouseover事件是必然冒泡的，一旦子元素mouseover了，本元素必然mouseover（除非子元素上禁止冒泡了）。

Answer 3

Mouseover：不论鼠标指针穿过被选元素或其子元素，都会触发 mouseover 事件。

Mouseenter：只有在鼠标指针穿过被选元素时，才会触发 mouseenter 事件。

Answer 4

其实很好区分的：

mouseover/mouseout事件支持冒泡，绑定的事件会冒泡到子标签上。mouseenter/mouseleave事件则只针对所绑定的标签，不会冒泡到子标签上。

可以参考这里，有完整的在线实例演示的：

通过实例来演示mouseouver(mouseout)与mouseenter(mouseleave)的区别

Answer 5

其实我认为这两类事件的核心区别在于mouseenter/mouseleave 不冒泡，而mouseover/mouseout是冒泡的 ，正式由于mouseover事件的冒泡，才导致在mouseover绑定的元素的后代元素中可触发此事件。可以参考这个github地址https://github.com/llemily/mouseX的代码，在控制台可以看到明显的差异。