转载：http://www.tuicool.com/articles/emiEfmz
点一下test按钮 如果不能正确说出弹出的顺序,请看转载链接
<body> <div id="divTest" style="width: 300px;height: 500px;background-color: red;"> <input type="button" value="test" id="test"> </div> <script> document.getElementById("test").addEventListener('click',function(event){ alert('btnTest-true'+event.eventPhase); },true); document.getElementById("divTest").addEventListener('click',function(event){ alert('divTest-false'+event.eventPhase); },false); document.getElementById("divTest").addEventListener('click',function(event){ alert('divTest'+event.eventPhase); },true); document.body.addEventListener('click',function(event){ alert('body'+event.eventPhase); },true); </script> </body>
相关推荐
DOM事件流包括三个阶段：事件捕获、目标阶段和事件冒泡。在捕获阶段，事件从最外层的元素（如HTML文档）向下传递到目标元素。然后，在目标阶段，事件真正发生在目标元素上。最后，事件冒泡阶段开始，事件从目标元素...
目录（一）DOM事件流① 定义② 图解③ 历史（二）冒泡（三）捕获（四）在不同的阶段执行事件（五）提高内存和性能 — 事件委托① 实例② 优点 （一）DOM事件流 ① 定义 DOM事件流包括三个阶段： 捕获阶段 目标阶段 ...
众所周知，事件流分为三个阶段冒泡分为捕获阶段，目标阶段和冒泡阶段， 这三个阶段到底是如何运行的呢？如果给同一个事件绑定上冒泡和捕获的事件到底会怎样触发呢？ 下面我用dom2级事件函数来变换捕获和冒泡，用...
DOM事件标准定义了两种事件流，这两种事件流有着显著的不同并且可能对你的...和许多Web技术一样，在它们成为标准之前，Netscape和微软各自不同地实现了它们，下面介绍DOM事件阶段以及事件捕获与事件冒泡先后执行顺序
冒泡事件和事件捕获是JavaScript中处理事件传播的两种主要模型，它们定义了事件在DOM树中传播的顺序。在实际的Web开发中，深入理解这两种模型对于正确处理事件，避免潜在的问题至关重要。 冒泡事件是指当一个事件在...
DOM事件流的示意图，清晰的展示了DOM事件流的捕获过程，以及冒泡过程
例如，在提供的代码示例中，当点击id3元素时，事件首先在捕获阶段执行obj2和obj3绑定的函数，然后在冒泡阶段执行obj1绑定的函数，因此显示顺序为id2、id3、id1。 `addEventListener`方法用于添加事件监听器，它接收...
事件流主要有三种阶段：事件捕获阶段、处于目标阶段和事件冒泡阶段。 事件捕获阶段是从DOM树的根节点开始，沿着树向下传播到目标节点。在这个阶段，事件首先由最外层的父元素接收，然后逐级向下传递，直到到达触发...
事件冒泡和事件捕获是两种不同的事件处理机制，它们决定了事件如何在DOM（Document Object Model）层次结构中传播。了解这两者对于优化事件处理性能和编写高效代码至关重要。 事件冒泡是从最具体的节点（通常是DOM...
javascript 中事件冒泡和事件捕获机制的详解 二者作用：描述事件触发时序问题 事件捕获：从document到触发事件的那个节点，即自上而下的去触发事件—由外到内 事件冒泡：自下而上的去触发事件—由内到外 绑定事件...
接下来是事件冒泡和事件捕获，它们是事件在DOM层次结构中传播的两种方式： - 事件冒泡：事件从最具体的节点（事件目标）开始，向上逐级传播到最不具体的节点（文档）。例如，点击一个按钮，事件会先触发按钮的事件...
在JavaScript中，事件的传播分为两个阶段：捕获阶段和冒泡阶段。 **捕获阶段**（Capture Phase）：当事件发生时，浏览器会从最外层的DOM节点（如`document`）开始，沿着DOM树向下传递事件，直到到达事件实际发生的...
事件处理有冒泡和捕获两个阶段。默认情况下，事件从最不具体的节点开始（捕获阶段），然后到达最具体的节点（冒泡阶段）。我们可以在添加事件监听器时指定`useCapture`参数为`true`，这样事件会在捕获阶段处理，而...
当页面上有父子关系的DOM元素分别绑定了多个事件处理器，且这些事件处理器分别在捕获阶段和冒泡阶段时，其执行顺序可能会让人困惑。因此，理解DOM事件的传播机制以及如何控制事件监听的执行顺序对于进行有效和正确的...
在DOM2级事件处理模型中，可以通过设置`addEventListener`方法的第三个参数来指定事件处理函数是在捕获阶段还是冒泡阶段执行。 ```javascript // 在冒泡阶段执行 button.addEventListener('click', function(event)...
- **DOM2级事件规范**定义了事件流的三个阶段：捕获阶段、处于目标阶段（事件到达目标元素）、冒泡阶段。在捕获阶段，事件由最外层元素开始，然后到达目标元素；处于目标阶段，事件在目标元素上触发；冒泡阶段，...
**事件流** 是事件传播的整个过程，包括事件捕获阶段、处于目标阶段（即事件实际发生的地方）和事件冒泡阶段。事件流描述了事件如何在DOM树中传递，提供了一种有序处理事件的方式。 总结来说，事件冒泡和事件捕获是...
5. **总结**：事件冒泡和事件捕获是JavaScript事件模型的两个阶段，它们定义了事件如何在DOM树中传播。事件委托则是一种高效利用事件处理的策略，可以降低内存消耗，提高性能，尤其适用于动态添加或删除DOM元素的...