在觸發(fā) DOM 上的某個(gè)事件時(shí)，會(huì)產(chǎn)生一個(gè)事件對(duì)象 event，這個(gè)對(duì)象中包含著所有與事件有關(guān)的信息。包括導(dǎo)致事件的元素、事件的類(lèi)型以及其他與特定事件相關(guān)的信息。
??所有瀏覽器都支持 event 對(duì)象，但支持方式不同。

DOM中的事件對(duì)象

兼容 DOM 的瀏覽器會(huì)將一個(gè) event 對(duì)象傳入到事件處理程序中。無(wú)論指定事件處理程序時(shí)使用什么方法（DOM0 級(jí)或 DOM2 級(jí)），都會(huì)傳入 event 對(duì)象。

  var btn = document.getElementById("myBtn");
  btn.onclick = function(event){
      alert(event.type);    //"click"
  };

  btn.addEventListener("click", function(event){
      alert(event.type);    //"click"
  }, false);

在通過(guò) HTML 特性指定事件處理程序時(shí)，變量 event 中保存著 event 對(duì)象。

  <input type="button" value="Click Me" onclick="alert(event.type)"/>

event 對(duì)象包含與創(chuàng)建它的特定事件有關(guān)的屬性和方法。觸發(fā)的事件類(lèi)型不一樣，可用的屬性和方法也不一樣。不過(guò)，所有事件都會(huì)有下表列出的成員。

在事件處理程序內(nèi)部，對(duì)象 this 始終等于 currentTarget 的值，而 target 則只包含事件的實(shí)際目標(biāo)。如果直接將事件處理程序指定給了目標(biāo)元素，則 this，currentTarget 和 target 包含相同的值。

  var btn = document.getElementById("myBtn");
  btn.onclick = function(event){
      alert(event.currentTarget === this);  //true
      alert(event.target === this);            //true
  }; 

如果事件處理程序存在于按鈕的父節(jié)點(diǎn)中（例如 document.body），那么這些值是不相同的。

document.body.onclick = function(event){
    alert(event.currentTarget === document.body);   //true
    alert(this === document.body);               //true
    alert(event.target === document.getElementById("myBtn")); //如果點(diǎn)擊“myBtn”，結(jié)果為true；如果點(diǎn)擊body,結(jié)果為false
}; 

注：只有在事件處理程序執(zhí)行期間， event 對(duì)象才會(huì)存在；一旦事件處理程序執(zhí)行完成， event 對(duì)象就會(huì)被銷(xiāo)毀。

IE中的事件對(duì)象

與訪(fǎng)問(wèn) DOM 中的 event 對(duì)象不同，要訪(fǎng)問(wèn) IE 中的 event 對(duì)象有幾種不同的方式，取決于指定事件處理程序的方法。

• 在使用** DOM0 級(jí)方法**添加事件處理程序時(shí)， event 對(duì)象作為 window 對(duì)象的一個(gè)屬性存在。

  var btn = document.getElementById("myBtn");
  btn.onclick = function(){
      var event = window.event;
      alert(event.type);     //"click"
  };

• 在使用DOM2級(jí)方法添加事件處理程序時(shí)， event 對(duì)象作為參數(shù)被傳入事件處理程序函數(shù)中。

  var btn = document.getElementById("myBtn");
  btn.attachEvent("onclick", function(event){
      alert(event.type);         //"click"
  });

• 在HTML特性指定的事件處理程序中，通過(guò) event 變量來(lái)訪(fǎng)問(wèn) event對(duì)象（與 DOM中的事件模型相同）。

  <input type="button" value="Click Me" onclick="alert(event.type)">

IE 的 event 對(duì)象同樣也包含與創(chuàng)建它的事件相關(guān)的屬性和方法。其中很多屬性和方法都有對(duì)應(yīng)的或者相關(guān)的 DOM屬性和方法。所有事件對(duì)象都會(huì)包含下表所列的屬性和方法：

跨瀏覽器的事件對(duì)象

var EventUtil = {

    getEvent: function(event){
        return event ? event : window.event;
    },

    getTarget: function(event){
        return event.target || event.srcElement;
    },

    preventDefault: function(event){
        if (event.preventDefault){
            event.preventDefault();
        } else {
            event.returnValue = false;
        }
    },

    stopPropagation: function(event){
        if (event.stopPropagation){
            event.stopPropagation();
        } else {
            event.cancelBubble = true;
        }
    },

    addHandler: function(element,type,handler){            
        if(element.addEventListener){ 
            element.addEventListener(type,handler,false); 
        }else if(element.attachEvent){                    
            element.attachEvent("on"+type,handler);
        }else{
            element["on"+type]=handler;             
        }
    },  

    removeHandler: function(element,type,handler){ 
        if(element.removeEventListener){
            element.removeEventListener(type,handler,false);
        }else if(element.detachEvent){
            element.detachEvent("on"+type,handler);
        }else{
            element["on"+type]=null;
        }
    }
};