<div onclick="alert(‘3‘);">
<div onclick="alert(‘2‘);">
<a id ="xx" href="#" onclick="alert(‘1‘);">
测试冒泡
</a>
</div>
</div>
上面这段代码一共有三个事件：alert(3)，alert(2)，alert(1),都分别绑定了单击事件。当我们点击“测试冒泡”这个a标签时，会连续弹出3个提示框。这就是事件冒泡引起的现象。事件冒泡的过程是：alert(1) --> alert(2) --> alert(3) 。
如果需要阻止事件冒泡，可以为div添加“阻止事件冒泡”：
document.getElementById("xx").addEventListener("click",
function(event) {
event.stopPropagation();
},
false);
原文：https://www.cnblogs.com/xjx199403/p/10770311.html