在javascript中的addEventListener（）方法的上下文中冒泡和捕获

Question

在addEventListner(event,function,useCapture)方法中，useCapture参数是两种冒泡和捕获类型。

我的问题是这个useCapture参数在js addEventListener（）方法的上下文中的功能/操作是什么？

Answer 1

来自the DOM events specification的图表可能有助于解释一些问题：

从中可以看出，事件分为三个阶段：捕获阶段，它起源于最高级别的视图并向下运行到事件所针对的后代元素at，然后是目标阶段，它发生在目标元素上，最后是冒泡阶段，它将层次结构返回到根视图。

绝大多数时候，你只需要或想要使用冒泡阶段（IE甚至不支持捕获阶段，直到IE9）。这是否必然是因为它更有用是一个问题;我们都已经习惯了它，它一直是持续创新的重点（取消冒泡等），因为（再次）多年来，如果你想支持IE，它是城里唯一的游戏。它确实很有意义，但接下来也是如此。

---

存在的原因主要是历史的怪癖。当然，很早就没有这方面的规范，当时占主导地位的浏览器（Netscape Navigator和Microsoft Internet Explorer）都是他们对事件所做的。 Netscape采用了“从根本上开始并进入最终目标”（捕获）的方法，微软采用了“从目标开始并以根本方式运行”（冒泡）的方法。因此，当标准化时，DOM委员会决定选择......两者。

Answer 2

addEventListener()方法的第三个参数（useCapture）以哪种方式决定 事件在html DOM中传播。

此参数具有布尔值，false表示冒泡，true表示捕获。 它是可选参数，默认值为false。

事件传播是一种在事件发生时定义元素顺序的方法。 假设您在 div 元素中有 h1 元素。如果用户点击 h1 元素， 那么哪个元素＆＃34;点击＆＃34;事件将先处理？

在 bubbling 中，最内层元素的事件将先处理，然后处理外部事件。 即 h1 元素＆＃34;＆＃34;点击＆＃34;将首先处理事件，然后处理 div 元素的事件。

在捕获 中，最外层元素的事件将先处理内部事件。 即 div 元素＆＃34;＆＃34;点击＆＃34;将首先处理事件，然后处理 h1 元素的事件。