DOM事件類
1.基本概念（DOM事件的級(jí)別）
2.DOM事件模型（捕獲、冒泡）
3.DOM事件流
4.DOM事件捕獲的具體流程
5.Event對(duì)象的常見應(yīng)用
6.自定義事件

基本概念---DOM事件的級(jí)別

• DOM0
  el.onclick = function(){//code...};
• DOM2
  el.addEventListener('click',function(){//code...},false);
• DOM3
  el.addEventListener('keyup',function(){//code...},false);

DOM事件模型（捕獲、冒泡）

捕獲------>目標(biāo)階段-------->冒泡

DOM事件流

事件通過捕獲到達(dá)目標(biāo)階段然后上傳到window對(duì)象

DOM事件捕獲的具體流程

window接收---->document---->html----->html-----body-----目標(biāo)元素
var btn = document.getElementById('btn');
window.addEventListener('click',function(){ console.log('window'); },true)//捕獲階段
document.addEventListener('click',function(){ console.log('document'); },true)
document.dcoumentElement.addEventListener('click',function(){ console.log('html'); },true)
document.body.addEventListener('click',function(){ console.log('body'); },true)
btn.addEventListener('click',function(){ console.log('btn'); },true)

Event對(duì)象的常見應(yīng)用

• event對(duì)象是事件響應(yīng)中最重要的對(duì)象
• event.preventDefault() 阻止默認(rèn)事件
• event.stopPropagation() 阻止冒泡
• event.stopImmediatePropagation() 綁定兩函數(shù)AB都會(huì)執(zhí)行，如果用這個(gè)，A執(zhí)行完會(huì)組織B。事件響應(yīng)優(yōu)先級(jí)
• event.currentTarget 當(dāng)前綁定的事件對(duì)象
• event.target 事件委托，事件代理，把自己子元素綁定到它們的父元素上判斷被點(diǎn)擊哪個(gè)元素，target表示當(dāng)前被點(diǎn)擊的元素
• srcElement IE中的target

自定義事件

var ev = document.getElementById('test');//獲取元素
var eve = new Event('custome');//創(chuàng)建自定義事件,只能指定事件名
ev.addEventListener('custome',function(){//code...})//為元素添加自定義事件
ev.dispatchEvent(eve);//觸發(fā)自定義事件
new customEvent()可指定事件名和object參數(shù)