DOM 事件的級別

• DOM0 element.onclick = function() {}
• DOM2 element.addEventListener('click', function() {},false)
• DOM3 element.addEventListener('keyup', function() {}, flase)

DOM 事件模型

• 捕獲：從上到下
• 冒泡：從當前元素往上

DOM 事件流：

瀏覽器在當前頁面與使用者做互動的過程，比如說點選了滑鼠左鍵，這個事件是怎麼傳到頁面上，這個就是事件流。它是怎麼響應的？分3個階段：

1. 捕獲
2. 目標階段（事件通過捕獲到達目標元素）
3. 從目標元素再上傳到window 物件就是冒泡過程

描述 DOM 事件捕獲的具體流程

Event 物件的常見應用

• event.preventDefault(): 阻止預設事件
• event.stopPropagation(): 阻止冒泡
• event.stopImmediatePropagation(): 一個按鈕綁定了兩個click 事件1，2，想通過優先順序的方式比如說第一個響應函式是A，第二個響應函式是B，依次註冊了A,B 兩個事件，按優先順序的方式想在A點選的時候不要執行B，在A 的響應事件中加上這個就可以阻止B事件的觸發
• event.currentTarget: 當前所繫結的事件
• event.target: 當前被點選的元素

自定義事件

var eve = new Event('custom')
ev.addEventListener('custom', function() {
   console.log('custom') 
})
ev.dispatchEvent(eve)

CustomEvent: 也是自定義事件的一個方法，如果想給事件加一些事件Event 是做不到的，這個時候就需要 CustomEvent

總結：Event 和 CustomEvent 都是做自定義事件的，他們兩個唯一的區別是：CustomEvent 除了可以指定事件名還可以加一個object 做引數（指定事件名+引數），event 不能加引數，兩個用法一樣