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