mouseover/mouseout与mouseenter/mouseleave的区别

大的div为父元素，小的div为子元素，

为父元素注册onmouseover事件，子元素不注册事件

f.onmouseover = function(){
        console.log("触发f的onmouseover");
}

当从父元素外部移动到子元素上时，会打印出两次“触发f的onmouseover”；

为父元素注册onmouseenter事件，，子元素注册事件

f.onmouseenter = function(){
        console.log("触发f的onmouseenter");
}

当从父元素外部移动到子元素上时，仅仅打印出1次“触发f的onmouseenter”；
onmouseover 会触发事件冒泡，onmouseenter不会触发事件冒泡

onmouseover/onmouseleave同理