dom事件流定义:事件流描述的是从页面接收事件的顺序,事件发生时会在元素节点之间按照特定的顺序传播,这个传播过程就是dom事件流
dom事件流分为三个阶段
1.捕获阶段
2.当前目标阶段
3.冒泡阶段
事件冒泡:IE最早提出,事件开始时由最具体的元素接收,然后逐级向上传播dom最顶层节点的过程
事件捕获:网景最早提出,由DOM最顶层节点开始,然后逐级向下传播到最具体的元素接收的过程
比如我们给一个div设置了鼠标点击事件那么下面就是它的事件流过程的图例
1.下面我们用代码来验证一下事件冒泡和事件捕获吧
下面由一个父盒子包含一个子盒子来演示
事件捕获案例
如果这个addEventListener 第三个参数如果是true,那么则处于捕获阶段 documen->html->body->father->son
事件冒泡阶段案例
如果这个addEventListener 第三个参数如果是false(如果不写的话默认是false),那么则处于冒泡阶段 son->father->body->html->documen
2.那么如何阻止事件的冒泡呢?
用stopPropagation即可阻止事件的冒泡