先來上一段個人總結的理解

1/事件分為三個部分

(1)捕獲階段

(2)目標階段

(3)冒泡階段

事件冒泡

1/事件冒泡只 針對"點選"事件而言 (為什麼得出這個結論呢:mousedown ,mouseup , mouseove ,fouce,blur 都嘗試寫了阻斷,當時都沒發阻止最上面的onclick的事件發生 )

2/事件冒泡的形象圖:

事件物件:事件特有的物件,e 是變數名,常用的名字,可以為任何名字

document.onclick = functionl(e){   //e 可以為任何名字,建議用e

　　//e有內容 常見的有 
     // e.target   目標
     
 
//e.type   事件型別 .....

　　//當點選的內容是document本身,那麼e.target === this //true
   //當點選的內容是它內部的div元素,那麼e.target ===this  //false

}

//事件委託

什麼是委託?

語言的含義: 我把一些感覺可以讓別人幫忙處理的問題委託給別人處理.

在此處在舉一個例子: 公司前臺MM收快遞

那什麼叫事件委託呢？它還有一個名字叫事件代理，JavaScript高階程式設計上講：事件委託就是利用事件冒泡，只指定一個事件處理程式，就可以管理某一型別的所有事件。那這是什麼意思呢？網上的各位大牛們講事件委託基本上都用了同一個例子，就是取快遞來解釋這個現象，我仔細揣摩了一下，這個例子
還真是恰當，我就不去想別的例子來解釋了，借花獻佛，我摘過來，大家認真領會一下事件委託到底是一個什麼原理：

有三個同事預計會在週一收到快遞。為簽收快遞，有兩種辦法：一是三個人在公司門口等快遞；二是委託給前臺MM代為簽收。現實當中，我們大都採用委託的方案（公司也不會容忍那麼多員工站在門口就為了等快遞）。前臺MM收到快遞後，她會判斷收件人是誰，然後按照收件人的要求籤收，甚至代為付款。
這種方案還有一個優勢，那就是即使公司裡來了新員工（不管多少），前臺MM也會在收到寄給新員工的快遞後核實並代為簽收。

這裡其實還有2層意思的：

第一，現在委託前臺的同事是可以代為簽收的，即程式中的現有的dom節點是有事件的；

第二，新員工也是可以被前臺MM代為簽收的，即程式中新新增的dom節點也是有事件的。

第二個點讓我聯想思考了冒泡事件的第二個階段
 

事件委託的原理(主要理解target屬性)::
就是利用事件冒泡原理(請先理解冒泡),然後通過target屬性,返回事件的目標節點,稱為事件源,可以理解為target是實際點選的哪個標籤(dom),但不是實際的dom.

為什麼要用事件委託?

一般來說，dom需要有事件處理程式，我們都會直接給它設事件處理程式就好了，那如果是很多的dom需要新增事件處理呢？比如我們有100個li，每個li都有相同的click點選事件，可能我們會用for迴圈的方法，來遍歷所有的li，然後給它們新增事件，那這麼做會存在什麼影響呢？

在JavaScript中，新增到頁面上的事件處理程式數量將直接關係到頁面的整體執行效能，因為需要不斷的與dom節點進行互動，訪問dom的次數越多，引起瀏覽器重繪與重排的次數也就越多，就會延長整個頁面的互動就緒時間，這就是為什麼效能優化的主要思想之一就是減少DOM操作的原因；如果要用事件委託，
就會將所有的操作放到js程式裡面，與dom的操作就只需要互動一次，這樣就能大大的減少與dom的互動次數，提高效能；

每個函式都是一個物件，是物件就會佔用記憶體，物件越多，記憶體佔用率就越大，自然效能就越差了（記憶體不夠用，是硬傷，哈哈），比如上面的100個li，就要佔用100個記憶體空間，如果是1000個，10000個呢，那隻能說呵呵了，如果用事件委託，那麼我們就可以只對它的父級（如果只有一個父級）這一個物件
進行操作，這樣我們就需要一個記憶體空間就夠了，是不是省了很多，自然效能就會更好。

這句話讓我有一個深的體會:原先認為dom的操作,對domj節點的增刪改查,樣式的變化等內容才會引起瀏覽器的重繪和重排,現在才知道給dom新增節點也會引起瀏覽器的重繪和重排.

參考資料:https://www.cnblogs.com/liugang-vip/p/5616484.html