JavaScript冒泡事件和stopPropagation方法

当一个元素上的事件被触发的时候，比如说鼠标点击了一个Button，同样的事件将会在那个元素的所有祖先元素中被触发。

这一过程被称为事件冒泡；这个事件从原始元素开始一直冒泡到DOM树的最上层。

js：

</p><p><pre class="javascript" name="code"><script type="text/javascript">
    var Bodyclick = function(){
        alert("冒泡了！！！");
    }
    window.onload = function(){
        var body = document.body;
        body.addEventListener('click',Bodyclick,false);//冒泡阶段
        //停止事件冒泡
        document.getElementById("stopBubble").addEventListener("click",
        function(event){
            alert("我是stopBubble_btn上事件");
            event.stopPropagation();
        },false);

        //正常事件冒泡
        document.getElementById("bubble").addEventListener("click",
        function(){
            alert("我是bubble_btn上事件");
        },false);
    };
</script>

html：

<button id="stopBubble">阻止冒泡</button>
<button id="bubble">冒泡</button>