浏览器事件流

今天主要介绍上我们使用的浏览器的事件流。

DOM2级事件规定的事件流包括三个阶段：



事件捕获阶段

处于目标阶段

事件冒泡阶段

事件捕获阶段（Event Capturing）

事件捕获的用意是在于事件到达预定目标之前捕获它。因此，事件捕获的过程是让不太具体的节点先更早接收到事件，而最具体的节点应该最后接收到事件。



如上图所示，按照事件捕获的思想，在此过程（click页面某个元素）中，document对象会首先接收到click事件，然后事件沿着dom树依次向下，一直传播到实际目标，即div元素。但是在事件流中的捕获阶段，实际目标div元素是不会接收到事件的，这就意味着没在捕获阶段，事件从document到再到后就停止了。（但是IE9、Safari、Chrome、Firefox和Opera9.5及更高版本都会在捕获阶段触发事件对象上的事件）

下一个阶段是“处于目标”阶段，于是事件在
发生，并在事件处理中被堪称冒泡阶段的一部分。最后，冒泡事件发生，事件又传播回文档。

冒泡阶段（Event Bubbling）

事件开始时由最具体的元素（文档中嵌套层次最深的那个节点）接收，然后逐级向上传播到较为不具体的节点，即document对象。

DOM2 与 DOM0区别

DOM2级事件定义了两个方法，用于处理指定和删除事件处理程序的操作：

addEventListener()

removeEventListener()

所有的DOM节点都包含这两个方法，而且接受三个参数：

要处理的事件名

作为事件处理程序的函数

一个boolean值，如果值为true，表示在捕获阶段调用事件处理程序；如果是false，表示在冒泡阶段调用此事件处理程序。