DOM0 事件和DOM2級(jí)在事件監(jiān)聽(tīng)使用方式上有什么區(qū)別瞬欧？
DOM0
DOM0事件處理程序是將一個(gè)函數(shù)賦值給事件處理程序的屬性卓囚，每個(gè)元素都有自己的事件處理程序?qū)傩粤溃@些屬性都是小寫(xiě)的谤专，如onclick將元素的屬性設(shè)置為一個(gè)函數(shù)牺丙，就可以為元素添加事件處理程序了堡牡，如：
var btnclick = document.getElementById('btnClick');
btnClick.onclick = function showMessage() {
alert(this.id);
}
這樣處理抒抬，事件處理程序被認(rèn)為是元素的方法，事件處理程序在元素的作用域下運(yùn)行晤柄，this就是當(dāng)前元素擦剑，所以點(diǎn)擊button結(jié)果是：btnclick
這樣還有一個(gè)好處，我們可以刪除事件處理程序芥颈，只需把元素的onclick屬性賦為null即可
DOM2
DOM2級(jí)事件定義了兩個(gè)方法用于處理指定和刪除事件處理程序的操作：
addEventListener
removeEventListener
所有的DOM節(jié)點(diǎn)都包含這兩個(gè)方法惠勒，并且它們都接受三個(gè)參數(shù)：
事件類(lèi)型
事件處理方法
布爾參數(shù)，如果是true表示在捕獲階段調(diào)用事件處理程序爬坑，如果是false纠屋，則是在事件冒泡階段處理剛才的例子 我們就可以這樣寫(xiě)：
var btnClick = document.getElementById('btnClick');
btnClick.addEventListener('click', function() {
alert(this.id);
},false);
btnClick.addEventListener('click', function() {
alert('hello!');
},false);
上面代碼為button添加了click事件處理程序只能通過(guò)removeEventListener移除，移除時(shí)參數(shù)與添加的時(shí)候相同盾计，這就意味著剛才我們添加的匿名函數(shù)無(wú)法移除售担，因?yàn)槟涿瘮?shù)雖然方法體一樣，但是句柄卻并不相同署辉，所以當(dāng)我們有移除事件處理程序的時(shí)候開(kāi)業(yè)這樣寫(xiě)
var btnClick = document.getElementById('btnclick');
var handler = function() {
alert(this.id);
}
btnClick.addEventListener('click',handler,false);
btnClick.removeEventListener('click',handler,false);
區(qū)別：
DOM0只能綁定一個(gè)事件處理方法族铆，因?yàn)楹蠼壎ǖ姆椒〞?huì)覆蓋前面的方法。DOM2能綁定多個(gè)事件處理方法哭尝。
attachEvent與addEventListener的區(qū)別哥攘？
再添加事件處理程序addEventListener和attachEvent主要有幾個(gè)區(qū)別：
- 參數(shù)個(gè)數(shù)不相同。
addEventListener有三個(gè)參數(shù)，attachEvent只有兩個(gè)献丑。addEventListener添加的事件處理程序只能發(fā)生在冒泡階段末捣，addEventListener第三個(gè)參數(shù)可以決定添加的事件處理程序是在捕獲階段還是冒泡階段處理(我們一般為了瀏覽器兼容性都設(shè)置為冒泡階段) - 第一個(gè)參數(shù)意義不同侠姑。
addEventListener第一個(gè)參數(shù)是事件類(lèi)型(比如click,load)创橄，而attachEvent第一個(gè)參數(shù)指明的是事件處理函數(shù)名稱(chēng)(onclick,onload) - 事件處理程序的作用域不同。
addEventListener的作用域是元素本身莽红，this是指的觸發(fā)元素妥畏，而attachEvent事件處理程序會(huì)在全局變量?jī)?nèi)運(yùn)行，this是window安吁，所以港愛(ài)例子才會(huì)返回undefined醉蚁，而不是元素id - 為一個(gè)事件添加多個(gè)事件處理程序時(shí)，執(zhí)行順序不同鬼店。
addEventListener添加會(huì)按照添加順序執(zhí)行网棍，而attachEvent添加多個(gè)事件處理程序時(shí)順序無(wú)規(guī)律(添加的方法少的時(shí)候大多是按照順序的反順序執(zhí)行的，但是添加的多了就無(wú)規(guī)律了)妇智，所以添加多個(gè)的時(shí)候滥玷，不依賴執(zhí)行順序的還好，若是依賴于函數(shù)執(zhí)行順序巍棱，最好自己處理惑畴，不要指望瀏覽器
解釋IE事件冒泡和DOM2事件傳播機(jī)制？
IE事件冒泡的流程是
當(dāng)監(jiān)測(cè)到一個(gè)事件發(fā)生時(shí)航徙，事件會(huì)從目標(biāo)元素開(kāi)始想父級(jí)傳遞如贷，直到傳遞到window(document)停止，這期間到踏，如果遇到同樣的事件杠袱，都會(huì)激活對(duì)應(yīng)的事件處理程序
如圖：
http://upload-images.jianshu.io/upload_images/5359241-2a41043d6f028bf0.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240
DOM事件流
DOM2級(jí)事件規(guī)定事件流包括三個(gè)階段：事件捕獲階段、處于目標(biāo)階段窝稿、事件冒泡階段楣富。首先發(fā)生的是事件捕獲，為截取事件提供機(jī)會(huì)讹躯，然后是實(shí)際目標(biāo)接收事件菩彬，最后是冒泡階段。
如圖：
http://upload-images.jianshu.io/upload_images/5359241-25d11410c7c8d0fa.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240
如何阻止事件冒泡潮梯？ 如何阻止默認(rèn)事件骗灶？
stopPropagation()方法和preventDefault()方法
stopPropagation()方法
document.getElementByTafName('a').onclick = function (e) {
e.preventDefault();
}
preventDefault()方法
document.getElementByTafName('a').onclick = function (e) {
e.stopPropagation();
}
