鼠标事件

2020-03-23  本文已影响0人  想发财的程序搬运学习猴子

1、onmouseover、onmouseout:鼠标经过时自身触发事件,经过其子元素时也触发该事件;(父亲有的东西,儿子也有) ,支持冒泡

2、onmouseenter、onmouseleave:鼠标经过时自身触发事件,经过其子元素时不触发该事件。(父亲的东西就是父亲的,不归儿子所有) ,不支持冒泡

 事件冒泡

比如说父元素添加了onclick事件,当子元素发生onclick事件时,父元素的onclick事件也会触发。

终止事件冒泡

方式一:   

    event.stopPropagation()

    在子元素相应的处理函数内,加入 event.stopPropagation() ,终止事件的广播分发,这样事件停留在本节点,不会再往外传播了。

方式二:

    if(event.target == event.currentTarget) {    ……}

    事件包含最初触发事件的节点引用 和 当前处理事件节点的引用,那如果节点只处理自己触发的事件即可,不是自己产生的事件不处理。event.target 引用了产生此event对象的dom 节点,而event.currrentTarget 则引用了当前处理节点,我们可以通过这两个target 是否相等。event.target永远是直接接受事件的目标DOM元素。

上一篇 下一篇

猜你喜欢

热点阅读