mouseover mouseout mouseenter mouseleave解释

根据单词本意，over就是上方，out是不再处于原来的位置，enter是进入，leave则是离开。

这样想，一个盒子里放了一个木块，木块与盒子空隙处是碎木屑。鼠标在

   <div class="tar animated">
        动画animation
        <h1> h1h1 </h1>
   </div>

   $(".tar").on("mouseover", ()=> {
        console.log('over')
    }).on("mouseout", ()=> {
        console.log('out')
    }).on("mouseenter", (event)=> {
        event.preventDefault();
        console.log('enter');
    }).on("mouseleave", (event)=> {
        event.preventDefault();
        console.log('leave');
    });

测试： 鼠标慢慢从“动画animation”上滑入，依次打印over enter，然后鼠标继续向下滑，进入“h1h1”，依次打印出out over，再继续向下滑出“h1h1”，再依次打印out leave。

刚开始的进入div，即是先进入领空，就是over，这个时候算是进入领地，即enter。接下来进入h1，就是离开了原先的位置进入新的子空间，打印out、over，离开h1，就是离开上一个位置，即out。h1也就是div的边缘，离开了总领地，即leave。

理解英文单词意思对理解代码很重要。