js 的冒泡和捕获事件

在JavaScript中，事件传播有两个阶段：捕获阶段和冒泡阶段。

1. 捕获阶段：事件从最外层开始，逐层向内传播。
2. 冒泡阶段：事件从最内层开始，逐层向外传播。

在添加事件监听器时，可以指定是在捕获阶段还是在冒泡阶段触发事件处理函数。

• true（或window.EventCapture）表示在捕获阶段触发。
• false（或window.EventBubble，通常简写为true）表示在冒泡阶段触发。

例子代码：

// 获取元素
var parent = document.getElementById('parent');
var child = document.getElementById('child');
 
// 添加事件监听器，在冒泡阶段
child.addEventListener('click', function() {
  console.log('child clicked (bubble)');
}, false);
 
// 添加事件监听器，在捕获阶段
parent.addEventListener('click', function() {
  console.log('parent clicked (capture)');
}, true);

当点击child元素时，控制台输出顺序将是：

1. parent clicked (capture) （捕获阶段）
2. child clicked (bubble) （冒泡阶段）

记住，在实际的浏览器事件传播模型中，并不是所有浏览器都遵循DOM事件标准，但大多数现代浏览器都支持这两种事件传播阶段。