DOM事件的級別

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

事件模型

捕獲與冒泡

事件流

事件通過捕獲到達目標元素，然后從目標元素冒泡到window對象

DOM事件捕獲的具體流程

window -> document -> html (通過document.documentElement可以獲取HTML節(jié)點) -> body -> .... -> 目標元素

冒泡流程

跟捕獲流程相反

Event對象

event.preventDefault() 阻止默認行為
event.stopPropagation() 阻止冒泡
event.stopImmediatePropagation() 當綁定了兩個事件，觸發(fā)事件A時加入這個函數(shù)可以阻止事件B的觸發(fā)
event.currentTarget 綁定事件的DOM
event.target 當前鼠標點擊的DOM

自定義事件

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

CustomEvent 跟 Event用法一樣，區(qū)別在于前者可以添加參數(shù)