mouseover和mouseenter的区别?

x33g5p2x  于2022-03-09 转载在 其他  
字(0.6k)|赞(0)|评价(0)|浏览(277)

一、写在前面
mouseovermouseenter之间是存在区别的,但是平时在使用的时候并不知道他们的区别,所以一直都处于混用的状态,下面这篇博客主要来详细叙述一下这两者的区别。
二、不同点
mouseovermouseenter最本质的区别是:mouseover支持事件冒泡,mouseenter不支持事件冒泡。

  1. ①、触发Amouseovermouseenter事件
  2. ②、触发Amouseoutmouseover事件,触发Bmouseovermouseenter事件
  3. ③、触发Amouseoutmouseover事件,触发Bmouseleavemouseout事件
  4. ④、触发Amouseoutmouseover事件,触发Cmouseovermouseenter事件
  5. ⑤、触发Amouseoutmouseenter事件,触发Cmouseleavemouseout事件。
  6. ⑥、触发Amouseoutmouseleave事件。

由上例子可以知道,mouseentermouseleave不存在事件冒泡,但是mouseoutmouseover存在事件冒泡。当在其子元素中来回切换时,mouseentermouseleave是不触发的,但是mouseoutmouseover是触发的。

相关文章