JS悬浮事件中hover、mouseenter、mouseleave、mousedown、mouseup、keydown、keyup、mouseover以及mouseout之间的区别

未经允许不得转载！！

水平有限，不周之处，欢迎指正、交流！！

之前在写悬浮事件的时候，一直以为都可以，而且还没出现莫名的bug，不放心，于是在这整理了下！

总之：hover = mouseenter + mouseleave        hover！= mouseover + mouseout。

悬浮hover事件指的是指针进入到DOM元素以及移出DOM元素之外就行触发的，即mouseenter+mouseleave。这两者之间是可以对等的。

那么mouseenter与mouseover的关系？

它们之间根本的区别就在于js的穿透现象，专业叫事件冒泡机制。mouseover事件进入到含有子元素的DOM元素中的时候，它不仅会对当前的DOM元素进行触发，还会对其子元素（或子元素对父元素进行冒泡）进行冒泡触发事件。

mousedown+mouseup：鼠标的按下与弹起事件触发；

keydown+keyup：可用于搜索栏的异步搜索提示，监控控件，用户动作的弹起与按下；

值得一提的还有一个mousemove，移动事件，这个事件在用户指针每移动一个像素，就会触发一次mousemove事件，由此会消耗大量的计算机应用内存，不到万不得已的项目中，切忌使用。