js 事件冒泡

一个页面中的多个dom如果呈现父子类关系，并且都绑定了事件，则会有事件冒泡的情况发生，例如：

<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);