在學校，聽老師講解事件冒泡和事件捕獲機制的時候跟聽天書一樣，只依稀記得ie使用的是事件冒泡，其他瀏覽器則是事件捕獲。當時的我，把它當成ie瀏覽器相容問題，所以沒有深究（ie8以下版本的瀏覽器已基本退出市場）。工作至今，雖然多次遇到該類問題，但均未深究，始終一知半解，遇到了全tm靠猜（選a不行就選b唄）。今天閒來無事自己做了個demo,算是把這個問題徹底搞明白了。
先上結論：他們是描述事件觸發時序問題的術語。事件捕獲指的是從document到觸發事件的那個節點，即自上而下的去觸發事件。相反的，事件冒泡是自下而上的去觸發事件。繫結事件方法的第三個引數，就是控制事件觸發順序是否為事件捕獲。true,事件捕獲；false,事件冒泡。預設false,即事件冒泡。jquery的e.stoppropagation會阻止冒泡，意思就是到我為止，我的爹和祖宗的事件就不要觸發了。
這是html結構12
3<divid="parent">
<divid="child" class="child">
現在我們給它們繫結上事件
document.getelementbyid("parent").addeventlistener("click",function(e))
document.getelementbyid("child").addeventlistener("click",function(e))
結果：
child事件被觸發，child結論：先child，然後parent。事件的觸發順序自內向外，這就是事件冒泡。parent事件被觸發，parent
現在改變第三個引數的值為true
document.getelementbyid("parent").addeventlistener("click",function(e),true)
document.getelementbyid("child").addeventlistener("click",function(e),true)
結果：
parent事件被觸發，parent結論：先parent,然後child。事件觸發順序變更為自外向內，這就是事件捕獲。child事件被觸發，child
貌似沒什麼卵用，上乙個利用事件冒泡的案例，反正我是經常會用到。
需求是這樣的：滑鼠放到li上對應的li背景變灰。利用事件冒泡實現：
$("ul").on("mouseover",function(e))也許有人會說，我們直接給所有li都綁上事件也可以啊，一點也不麻煩，只要……
$("li").on("mouseover",function())是，這樣也行。而且從**簡潔程度上，兩者是相若彷彿的。但是，前者少了乙個遍歷所有li節點的操作，所以在效能上肯定是更優的。
還有就是，如果我們在繫結事件完成後，頁面又動態的載入了一些元素……
這時候，第二種方案，由於繫結事件的時候item7還不存在，所以為了效果，我們還要給它再繫結一次事件。而利用冒泡方案由於是給ul綁的事件……
高下立判！
徹底弄懂JS的事件冒泡和事件捕獲
先上結論 他們是描述事件觸發時序問題的術語。事件捕獲指的是從document到觸發事件的那個節點，即自上而下的去觸發事件。相反的，事件冒泡是自下而上的去觸發事件。繫結事件方法的第三個引數，就是控制事件觸發順序是否為事件捕獲。true,事件捕獲 false,事件冒泡。預設false,即事件冒泡。jqu...
徹底弄懂JS的事件冒泡和事件捕獲
在學校，聽老師講解事件冒泡和事件捕獲機制的時候跟聽天書一樣，只依稀記得ie使用的是事件冒泡，其他瀏覽器則是事件捕獲。當時的我，把它當成ie瀏覽器相容問題，所以沒有深究 ie8以下版本的瀏覽器已基本退出市場 工作至今，雖然多次遇到該類問題，但均未深究，始終一知半解，遇到了全tm靠猜 選a不行就選b唄 ...
徹底弄懂JS事件委託的概念和作用
一 寫在前頭 接到某廠 問什麼是事件 的時候,一開始說addeventlistener,然後他說直接繫結新的元素不會報dom不存在的錯誤嗎？然後我就混亂了,我印象中這個方法是可以繫結新節點的。後面才知道,原來他要考察的是事件委託 的原理,他指的是未來還不清楚會建立多少個節點,所以沒辦法實現給他們註冊...