哎 js事件冒泡機制和阻止冒泡 阻止默認行為好像永遠也整不清楚，記了忘 忘了記。。。醉了

這篇文章寫完以後下次再忘記 就呼自己一巴掌，忘一次一巴掌

　　首先要明白兩個概念——事件和事件流

　　事件指的是用戶或瀏覽器自身執行的某種動作，又稱為原始事件模型，例如onclick等

　　事件流指的是 從頁面中接收事件的順序，也就是說當一個事件產生時，這個事件的傳播過程就叫做事件流。

事件冒泡：

　　從事件目標開始 一級級向上冒泡，到document為止——從裏到外

　　IE 5：div--body--document;

　　IE6：div--body--html--document;

　　mozilla：div--body--html--window

**值得註意的是，IE8-只能傳播到document。

事件捕獲：

　　從最外層document開始觸發，最後到最精確的事件目標——從外到裏

**和事件冒泡相反，用意是在事件達到目標前就捕獲它

DOM事件流：

　　同時支持兩種事件模型——事件冒泡和事件捕獲，但是捕獲會先發生。兩種事件會觸及dom中所有的對象，從document對象開始，也在document對象中結束。

　　DOM標準規定，事件流有3個階段：

　　事件捕獲階段——處於目標階段——事件冒泡階段

一張圖以蔽之：

綁定事件的時候可以自己選擇是采用事件捕獲還是事件冒泡：

通過addEventListener函數，它有第三個參數，如果設置為true，就是采用事件捕獲，如果是false，則表示事件冒泡

true：捕獲

false：冒泡

element.addEventListener(‘click‘,doSomething,true)

值得註意的是，IE只支持事件冒泡，不支持事件捕獲，也不支持addEventListener，但是它可以使用另一個函數attachEvent來綁定

element.attachEvent(‘onclick‘,doSomething)

阻止事件傳播！！！記了一輩子了都沒記住的地方！！！

普通：

stopPropagation()

IE：

cancleBubble = true;

在捕獲的過程中stopPropagation 後面的冒泡過程就不會發生了

        function stopBubble(){
            if(e&& e.stopPropagation){
                e.stopPropagation();  //非IE
            }else{
                window.event.cancleBubble = true;
            }
        }

阻止默認事件

普通：

preventDefault()

IE：

window.event.returnValue = false;

        function stopDefault(){
            if(e&& e.preventDefault){
                e.preventDefault(); //非IE
            }else{
                window.event.returnValue = false;
            }
        }　                                      

總結：

事件冒泡——從裏到外 從a-div-body-html-document-window（低版本IE到document）

事件捕獲——從外到裏 從window-html-body-div-a

阻止冒泡

普通——e.stopPropagation

IE——window.event.cancleBUbble=true;

阻止默認事件

普通——e.preventDefault

IE——window.event.returnValue = false;

這可能是最簡明扼要的 js事件冒泡機制+阻止默認事件 講解了