JS鼠标事件基础

一、鼠标事件

mousedown:鼠标按钮被按下（左键或者右键）时触发。不能通过键盘触发。
mouseup:鼠标按钮被释放弹起时触发。不能通过键盘触发。
click:单击鼠标左键或者按下回车键时触发。这点对确保易访问性很重要，意味着onclick事件处理程序既可以通过键盘也可以通过鼠标执行。
dblclick:双击鼠标左键时触发。
mouseover:鼠标移入目标元素上方。鼠标移到其后代元素上时会触发。
mouseout:鼠标移出目标元素上方。
mouseenter:鼠标移入元素范围内触发，该事件不冒泡，即鼠标移到其后代元素上时不会触发。
mouseleave:鼠标移出元素范围时触发，该事件不冒泡，即鼠标移到其后代元素时不会触发。
mousemove:鼠标在元素内部移到时不断触发。不能通过键盘触发。

二、onmouseover、onmouseout与onmouseenter、onmouseleave区别
onmouseover、onmouseout：（冒泡）
鼠标经过时自身触发事件，经过其子元素时也触发该事件；（父亲有的东西，儿子也有）

onmouseenter、onmouseleave：（不冒泡）
鼠标经过时自身触发事件，经过其子元素时不触发该事件。（父亲的东西就是父亲的，不归儿子所有）

这四个事件两两配对使用，onmouseover、onmouseout一对，onmouseenter、onmouseleave一对，不要混合使用。

onmousemove与onmouseover的区别
时间上： onmousemove 事件触发后，再触发 onmouseover 事件。

动作上 ：onmouseover 只在刚进入区域时触发；

onmousemove 除了刚进入区域触发外，在区域内移动鼠标，也会触发该事件。

注意：当鼠标移动很快时，可能不会触发这两个事件。

onmouseover与onmousemove的区别是：

当鼠标移过当前对象时就产生了onmouseover事件（onmouseover有个移入移出的过程）,当鼠标在当前对象上移动时就产生了onmousemove事件，只要是在对象上移动而且没有移出对象的，就是onmousemove事件