美文网首页
mouseenter 与 mouseover的区别

mouseenter 与 mouseover的区别

作者: 廊桥梦醉 | 来源:发表于2020-08-25 17:00 被阅读0次

mouseenter(进入)、mouseleave、mouseover(覆盖)和mouseout是常用来判断鼠标移出和移入的事件,虽然功能上差不多,但是细节却有不同的地方。

  为了方便浏览,我将控制台的8个输出标记了序号,下面来说明一下(红色盒子为父盒子,蓝色盒子为子盒子):

    ①② 首先移入红色盒子范围内,触发了进入盒子的mouseover和mouseenter事件,且mouseover触发时间优先于mouseenter;

    ③④ 然后当移入到蓝色盒子时,触发了离开红色盒子的mouseout事件,同时触发了蓝色盒子mouseover进入事件,说明mouseover不仅在父元素会触发,在子元素也会触发;

    ⑤⑥ 再然后又移入红色盒子时,触发了蓝色盒子的mouseout事件和红色盒子的mouseover事件,同理说明mouseout不仅在父元素会触发,在子元素也会触发;

    ⑦⑧ 最后移出红色盒子时,触发mouseout和mouseleave事件。

相关文章

  • js零散知识记录

    1、mouseenter和mouseover的区别 mouseenter和mouseover都是鼠标进入被选元素后...

  • 下拉菜单jQuery实现效果

    一 mouseenter跟mouseover事件的区别 区别:mouseover/mouseout 事件,鼠标经过...

  • 【面试题】某某和某某的区别

    1.mouseenter与mouseover的区别 mouseenter: 当鼠标从元素的边界之外移入元素的边界之...

  • JS补充笔记

    1、mouseenter 和 mouseover 的区别 mouseenter 鼠标事件 :当鼠标移动到元素上时...

  • mouseenter 与 mouseover的区别

    mouseenter(进入)、mouseleave、mouseover(覆盖)和mouseout是常用来判断鼠标移...

  • JS知识点积累

    1、mouseover和mouseenter的区别 两者都是鼠标移入元素时触发,区别在于mouseenter不支持...

  • mouse事件的区别

    mouseover和mouseenter事件的区别 mouseover : 在鼠标移动到选取的元素及其子元素上触发...

  • 6.mouseenter与mouseover的区别

    mouseenter与mouseover区别 over属于滑过事件,从父元素进入到子元素,属于离开了父元素,会触发...

  • JQuery常用API整理

    mouseover与mouseenter 不论鼠标指针穿过被选元素或其子元素,都会触发 mouseover 事件。...

  • mouseover与mouseenter/mouseout与mo

    mouseover与mouseenter 不论鼠标指针穿过被选元素或其子元素,都会触发 mouseover 事件。...

网友评论

      本文标题:mouseenter 与 mouseover的区别

      本文链接:https://www.haomeiwen.com/subject/sxersctx.html