JavaScript中的mouseover与mouseenter，mouseout和mouseleave的区别

1、mouseover与mouseenter

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

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

简单写个例子：

    
    
    


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

    
被触发的 Mouseover 事件次数：


    
被触发的 Mouseenter 事件次数：

效果:

2、mouseout与mouseleave

     mouseout事件：不论鼠标指针离开被选元素还是任何子元素，都会触发 mouseout 事件。

     mouseleave事件：只有在鼠标指针离开被选元素时，才会触发 mouseleave 事件。

简单写个例子：

    
    
    


 mouseout事件：不论鼠标指针离开被选元素还是任何子元素，都会触发 mouseout 事件。
 mouseleave事件：只有在鼠标指针离开被选元素时，才会触发 mouseleave 事件。

    
被触发的 mouseout 事件次数：


    
被触发的 mouseleave 事件次数：

效果：