js事件冒泡

JavaScript事件冒泡是指当一个元素触发了某个事件，该事件将逐层向上冒泡到父元素，直到冒泡到文档根节点。

事件冒泡的过程可以用以下示例来说明：

<div id="parent">
  <div id="child">
    <button id="button">点击按钮</button>
  </div>
</div>

document.getElementById("button").addEventListener("click", function(event) {
  console.log("按钮被点击了");
  event.stopPropagation(); // 阻止事件继续冒泡
});

document.getElementById("child").addEventListener("click", function() {
  console.log("子元素被点击了");
});

document.getElementById("parent").addEventListener("click", function() {
  console.log("父元素被点击了");
});

如果我们点击按钮，控制台将输出：

按钮被点击了
子元素被点击了
父元素被点击了

事件从按钮开始冒泡到子元素，然后再冒泡到父元素。

如果在按钮的事件处理函数中调用了event.stopPropagation()方法，那么事件将停止冒泡，不再传递给父元素，控制台将只输出：

按钮被点击了

事件冒泡在开发中非常有用，可以方便地实现事件委托、事件代理等功能