1.DOM2和DOM0級共同優點：可以給一個元素上新增多個事件處理程式，會按照順序執行。<br>
DOM2級事件處理程式，ie不支援，ie有專用的事件處理程式。<br>
DOM2級事件處理程式：定義了兩個方法---用於處理指定和刪除事件處理程式的操作。【addEventListener()---給某元素新增一個事件監聽程式】和【removeEventListener()---刪除一個事件。必須傳入新增事件時相同的引數】（通過前者新增的事件，只能通過後者刪除。如obj.click= null無效）<br>

3個引數：要處理的事件名、作為處理時間處理程式的函式及一個boolean（true---表示在捕獲階段呼叫事件處理程式，false---表示在冒泡階段呼叫事件處理程式(可以最大限度的相容瀏覽器)。一般設為false

）.<br>如：object.addEventListener("click",function(){},false);

btn3.addEventListener('click',showMes,false);
注意：
1、若事件名稱有on，則需去掉on。onclick --> click，onmouseover -->mouseover等等；
2、false 最大限度相容所有瀏覽器--事件冒泡流。
3.通過addEventListener新增的事件只能通過removeEventListener來刪除。--引數要與新增事件時相同
btn3.removeEventListener(引數);//引數必須和btn.addEventListener的引數一致，刪除事件監聽

DOM0級和DOM2級事件處理程式可以給一個事件繫結多個函式，事件觸發的時候會按照繫結順序執行各個函式。如下所示：
btn3.addEventListener('click',showMes,false);
btn3.addEventListener('click',showMes,function(){alert(this.value）;},false);缺點：IE不支援該事件

2.IE事件處理程式：IE也提供了類似DOM2級事件處理程式
attachEvent()新增事件
detachEvent()刪除事件接收相同的兩個引數，事件處理程式的名稱和事件處理程式的函式。去掉了布林值，不使用第三個引數的原因:IE8

以及更早的瀏覽器版本只支援事件冒泡！在ie下給btn3新增事件
btn3.attachEvent('onclick',showMes);
主意：在ie事件處理程式上，又要把on加上
btn3.detachEvent('onclick',showMes);
支援ie事件處理程式的瀏覽器主要有ie和opera兩個瀏覽器。

3.跨瀏覽器事件處理程式

解決瀏覽器相容問題的最好方法是能力檢測，有這個能力就使用這種方法，沒有就使用別的方法。瀏覽器支援addEventListener，就使用這個方法；瀏覽器支援attachEvent，就使用這個方法。跨瀏覽器事件處理最好封裝在一個物件內。

//跨瀏覽器事件處理程式
var eventUtil = {
//新增控制代碼
addHandler:function(element,type,handler){
if(element.addEventListener){element.addEventListener(type,handler,false);}// DOM2級事件處理程式
elseif(element.attachEvent){element.attachEvent('on'+type,handler);} // IE事件處理程式
else{element['on'+type]=handler;} // DOM0級事件處理程式
},
//刪除控制代碼
removeHandler:function(element,type,handler){
if(element.removeEventListener){element.removeEventListener(type,handler,false);}// DOM2級事件處理程式
else if(element.detachEvent){element.detachEvent('on'+type,handler);}// IE事件處理程式
else{element['on'+type]=null;} //DOM0級事件處理程式
}
}
eventUtil.addHandler(btn3,'click',showMessage);

3.js中所有用'.'的地方都可以使用'[]'如：物件的點選事件element.onclick===element['onclick']