js阻止事件冒泡的方法

在 JavaScript 中，可以使用以下两种方法来阻止事件冒泡：

1. stopPropagation() 方法

该方法是 Event 对象的方法，可以阻止事件的进一步传播。例如：

document.getElementById("myDiv").addEventListener("click", function(event){
  alert("Div clicked!");
  event.stopPropagation();
});

document.getElementById("myButton").addEventListener("click", function(event){
  alert("Button clicked!");
});

在上面的例子中，当点击 myDiv 元素时，会触发该元素的 click 事件，并且会弹出 "Div clicked!" 的提示框。同时，我们使用 stopPropagation() 方法来阻止事件继续传播到 myButton 元素，因此不会触发该元素的 click 事件。

2. cancelBubble 属性

该属性是 IE 事件模型的属性，可以阻止事件的进一步传播。例如：

document.getElementById("myDiv").onclick = function(){
  alert("Div clicked!");
  window.event.cancelBubble = true;
};

document.getElementById("myButton").onclick = function(){
  alert("Button clicked!");
};

在上面的例子中，当点击 myDiv 元素时，会触发该元素的 click 事件，并且会弹出 "Div clicked!" 的提示框。同时，我们将 cancelBubble 属性设置为 true，以阻止事件继续传播到 myButton 元素，因此不会触发该元素的 click 事件。