- 基本概念：DOM事件的級別
- DOM事件模型（冒泡和捕獲）
- DOM事件流
- 描述DOM事件捕獲的集體流程
- Event對象的常見應(yīng)用
- 自定義事件
DOM事件類 事件級別
- DOM0 element.onclick=function(){}
- DOM2
element.addEventListener('click',function(){},false) - DOM3(增加了多種事件類型蟆肆，比如鼠標(biāo)事件抑诸，鍵盤事件）
element.addEventListener('keyup',function(){},false)false默認(rèn)為冒泡階段
DOM事件模型
就是冒泡和捕獲兩種迁匠，捕獲是從上往下，冒泡是從當(dāng)前元素也就是目標(biāo)元素往上奈惑。
DOM事件流
第一階段：捕獲
第二階段：目標(biāo)階段
第三階段：冒泡
描述DOM事件捕獲的集體流程
(補(bǔ)充：document.documentElement獲取html這個節(jié)點(diǎn)）
第一個接收到的對象是window矛缨，然后傳給document拐叉，再傳給html毫深，再傳給目標(biāo)元素的父級元素，然后傳給目標(biāo)元素驾诈。
然后再往回一層一層冒泡
Event對象的常見應(yīng)用
分別對應(yīng)：
1.阻止默認(rèn)事件
2.阻止事件冒泡
3.設(shè)置事件優(yōu)先級缠诅。阻止事件冒泡并且阻止相同事件的其他偵聽器被調(diào)用。如果有多個相同類型事件的事件監(jiān)聽函數(shù)綁定到同一個元素乍迄，當(dāng)該類型的事件觸發(fā)時管引，它們會按照被添加的順序執(zhí)行。如果其中某個監(jiān)聽函數(shù)執(zhí)行了 event.stopImmediatePropagation() 方法闯两，則當(dāng)前元素剩下的監(jiān)聽函數(shù)將不會被執(zhí)行褥伴。
p.addEventListener("click", (event) => {
alert("我是p元素上被綁定的第二個監(jiān)聽函數(shù)");
event.stopImmediatePropagation();
// 執(zhí)行stopImmediatePropagation方法,阻止click事件冒泡,并且阻止p元素上綁定的其他click事件的事件監(jiān)聽函數(shù)的執(zhí)行.
}, false);
p.addEventListener("click",(event) => {
alert("我是p元素上被綁定的第三個監(jiān)聽函數(shù)");
// 該監(jiān)聽函數(shù)排在上個函數(shù)后面谅将，該函數(shù)不會被執(zhí)行
}, false);
document.querySelector("div").addEventListener("click", (event) => {
alert("我是div元素,我是p元素的上層元素");
// p元素的click事件沒有向上冒泡，該函數(shù)不會被執(zhí)行
}, false);
4.往往用于事件委托中重慢，獲取當(dāng)前被點(diǎn)擊的元素
5.當(dāng)前所綁定的事件對象饥臂，如事件委托中所綁定的父級對象。
自定義事件
通過new Event創(chuàng)建自定義事件
dispatchEvent來觸發(fā)事件似踱。
代碼演示：
注意：觸發(fā)的時候隅熙，不是事件名，是事件對象核芽。
