DOM事件類

DOM事件類

• 基本概念：DOM事件的級別
• DOM事件模型
• DOM事件流
• 描述DOM事件捕獲的具體流程
• Event對象的常見應用
• 自定義事件

一、DOM事件的級別

• DOM0 element.onclick=function(){}
• DOM2 element.addEventListener('click',function(){},false)(冒泡和捕獲 true 時在捕獲階段)
• DOM3 element.addEventListener('keyup',function(){},false)鼠標鍵盤事件

二、事件模型

• 捕獲、冒泡

三、事件流

• 捕獲 <--> 冒泡
• 事件經過捕獲到達目的階段，從目標元素上傳到window對象也就是冒泡

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

• window-->document-->html-->body-->...-->目標元素
• 獲取html是document.documentElement

五、Event對象的常見應用

• event.preventDefault() 阻止默認事件（a跳轉）
• event.stopPropagation() 阻止冒泡行爲
• event.stopImmediatePropagation() 事件響應優先級
• event.currentTarget() 當前綁定的事件
• event.target() 目標元素

六、自定義事件

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