js中，我們可以給一個dom對象添加監聽事件，函數就是

addEventListener("click",function(){},true);

很容易理解，第一個參數是事件類型，比如點擊(click)、觸摸(touchstart)，

第二個參數就是事件函數，

比如我給一個button添加alert函數。

window.onload=function(){
document.getElementById("hello").addEventListener("onkeydown",function () {
alert("hello");
});
}

那麽第三個參數是什麽呢？這個參數設計到事件的捕獲與冒泡，為true時捕獲，false時冒泡。

什麽意思呢？

我舉個簡單的例子，我有兩個div和一個button，button在div2裏面，div2在div1裏面。如下圖所示

給button、div1、div2、都添加了click事件，分別alert button、div1、div2。

window.onload=function(){
document.getElementById("btn").addEventListener("click",function () {
// body...
alert("hello");
});
document.getElementById("div1").addEventListener("click",function(){

那麽問題就來了，我點擊button，也相當於點擊了div1和div2，那麽，誰先出現呢？

直觀的講，誰在上面，誰在下面。

所以，在js中就分為了兩個處理方法，冒泡和捕獲。

冒泡：從裏面往外面觸發事件，就是alert的順序是 button、div2、div1。

捕獲：從外面往裏面觸發事件，就是alert的順序是div1、div2、button。

要想冒泡，就要將每個監聽事件的第三個參數設置為false,也就是默認的值。

要想捕獲，就要將每個監聽事件的第三個參數設置為true。

好了，就講這麽多了。為了更好的理解冒泡和捕獲，大家可以給三個事件的第三個參數隨便設置，就是說不同時設置為true或false,

給button為true，div1為false等等，根據結果就能更好的理解這兩個概念了。

js中addEventListener第三個參數涉及到的事件捕獲與冒泡