事件流(事件捕获,事件冒泡,阻止冒泡，解绑事件)

1.1 事件流和两个阶段说明

• 简述:事件流顾名思义可以理解为事件的流动路径,过程如下图所示

• 事件流的两个阶段,一个是捕获阶段，另一个是冒泡阶段,简单来说事件捕获就是从父到子,而冒泡阶段则是从子到父.

1.2 事件捕获

• 概念:从DOM的根元素开始去执行对应的事件 (从外到里)

• 说明： · addEventListener第三个参数传入 true 代表是捕获阶段触发（很少使用）

              · 若传入false代表冒泡阶段触发，默认就是false

              · 若是用 L0 事件监听，则只有冒泡阶段，

1.3 事件冒泡

• 事件冒泡概念: 当一个元素的事件被触发时，同样的事件将会在该元素的所有祖先元素中依次被触发。这一过程被称为事件冒 泡

• 简单理解：当一个元素触发事件后，会依次向上调用所有父级元素的 同名事件

• 事件冒泡是默认存在的 

• L2事件监听第三个参数是 false，或者默认都是冒泡

1.4 阻止冒泡

• 问题：因为默认就有冒泡模式的存在，所以容易导致事件影响到父级元素

• 需求：若想把事件就限制在当前元素内，就需要阻止事件冒泡 l 前提：阻止事件冒泡需要拿到事件对象

• 语法：

• 注意：此方法可以阻断事件流动传播，不光在冒泡阶段有效，捕获阶段也有效

1.5 解绑事件

两种注册事件的区别

• 传统on注册（L0）

 同一个对象,后面注册的事件会覆盖前面注册(同一个事件)

 直接使用null覆盖偶就可以实现事件的解绑

 都是冒泡阶段执行的

• 事件监听注册（L2）

语法: addEventListener(事件类型, 事件处理函数, 是否使用捕获)

后面注册的事件不会覆盖前面注册的事件(同一个事件)

可以通过第三个参数去确定是在冒泡或者捕获阶段执行

必须使用removeEventListener(事件类型, 事件处理函数, 获取捕获或者冒泡阶段)

匿名函数无法被解