简单说一下事件冒泡与事件捕获?
了解它们
事件流
首先我们了解一下什么叫做事件流。
事件流呢:在事件发生时,会在发生事件的元素节点与DOM树根节点之间按照特定顺序进行传播,这个过程称为事件流
我们平常说的事件冒泡、事件捕获 就是事件流
1.什么叫做事件冒泡:
所谓冒泡指的就是事件的向上传导,当后代元素上的事件被触发时,其祖先元素的相同事件也会被触发,可以理解为一条鱼在水中吐泡,而这个泡是从水里向水面传送,里到外。
文本节点–>元素节点—>body—>html—>document(例如点击事件)<向上响应>
2.什么叫做事件捕获:
是从最外面开始触发的,直到捕获到你点击的div事件为止。
document–>html–>body–>元素节点–>文本节点 <向下响应>
3.应用:
在使用"事件监听"的方式绑定事件时,可以设置事件的响应方式。
DOM对象.addEventListener(事件,事件处理程序,事件冒泡方式)。
事件冒泡方式:
(1)默认为false,表示冒泡阶段完成事件处理
(2)true为捕获阶段完成事件处理
4.阻止事件冒泡:
阻止事件冒泡的方式
常用方法:
(1)事件委托:将元素的绑定事件写起其父元素上,防止事件冒泡
(2)event.stopPropagation():可以阻止事件冒泡,阻止父级元素的绑定事件
小作者持续更新中…