事件流

事件流描述的是从页面中接受事件的顺序

微软（IE）的事件流是事件冒泡流(event bubbling) 目标元素被点击,然后扩散到外围被点击
而网景(Netscape)的事件流是事件捕获流(event capturing) 从最外层的body被点击,然后深入到目标元素被点击

DOM事件流：

DOM2级事件规定的事件流包含3个阶段，事件捕获阶段、处于目标阶段、事件冒泡阶段

DOM 2级事件定义了两方法：用于处理添加事件和删除事件的操作： 添加事件 addEventListener() 删除事件 removeEventListener()

第三个参数默认是false,表示这个事件冒泡阶段处理 (则捕获阶段事件不会触发)
第三个参数是true,表示这个事件捕获阶段处理 ()

事件监听器分为在捕获阶段注册的和在冒泡阶段注册的

在捕获阶段注册的事件监听器在捕获阶段触发
在冒泡阶段注册的事件监听器在冒泡阶段触发

Event.target
Event.currentTarget

阻止事件的冒泡:

DOM事件对象提供了stopPropagation方法用于阻止事件流。

DOM 0级事件流:

1. 元素.onClick = function(){}
2. 标签里面写onClick属性

onclick事件发生在冒泡阶段

总结

事件监听器是一个对事件作出反应的门卫

事件监听器可以选择在捕获阶段注册还是在冒泡阶段注册

在捕获阶段注册的监听器只对从外边来的事件(如click)做出反应,而不对由里而外的事件做出反应

在冒泡阶段注册的监听器只对从里边出去的事件(如click)做出反应,而不对从外边来的事件做出反应

实际上dom事件流的捕获和冒泡都是存在的,只是在某一阶段注册的监听器在另一个阶段不对事件做出反应而已(例如在冒泡阶段注册的click监听器不对捕获阶段的click事件做出反应,但是捕获阶段还是存在的,其它注册在捕获阶段的监听器会做出反应)

ref

https://www.cnblogs.com/christineqing/p/7607113.html