什么是事件對(duì)象？事件對(duì)象的使用

更新時(shí)間:2021-09-08 來源:黑馬程序員瀏覽量:

IT培訓(xùn)班

當(dāng)一個(gè)事件發(fā)生后，跟事件相關(guān)的一系列信息數(shù)據(jù)的集合都放到這個(gè)對(duì)象里面。這個(gè)對(duì)象就是even，只有有了事件，evem才會(huì)存在，它是系統(tǒng)自動(dòng)創(chuàng)建的，不需要傳遞參數(shù)事件對(duì)象是事件--系列相關(guān)數(shù)據(jù)的集合，例如，鼠標(biāo)單擊的事件對(duì)象，就包含了鼠標(biāo)相關(guān)信息，如鼠標(biāo)指針坐標(biāo)等。如果是鍵盤事件，事件對(duì)象中就包含鍵盤事件的相關(guān)信息，例如，用戶按下了哪個(gè)鍵，事件對(duì)象中就會(huì)包括按下鍵的鍵值等相關(guān)信息。

雖然所有瀏覽器都支持事件對(duì)象event,但是不同的瀏覽器獲取事件對(duì)象的方式不同，標(biāo)準(zhǔn)瀏覽器中會(huì)將一個(gè)event對(duì)象直接傳人到事件處理程序中，而早期版本的IE瀏覽器6~IE8)中，僅能通過window.event才能獲取事件對(duì)象，語法格式如下。

var事件對(duì)象=window.event              //早期IE內(nèi)核瀏覽器

DOM對(duì)象，事件=function (event) ()     //W3C內(nèi)核瀏覽器

上述代碼中，因?yàn)樵谑录|發(fā)時(shí)就會(huì)產(chǎn)生事件對(duì)象，并且系統(tǒng)會(huì)以實(shí)參的形式事件處理函數(shù)。所以，在事件處理函數(shù)中需要用一個(gè)形參來接收事件對(duì)象event接下來我們以獲取buttion按鈕單擊事件的事件對(duì)象為例進(jìn)行代碼演示，示例代碼如下：

<buttonid="btn">獲取event對(duì)象</button>

<script>

var btn=document. getlementBYID('btn');

btn.onclick=function(e) {

var event=e|| window.event;  // 獲取事件對(duì)象的兼容處理

console,log(event);

};

</script>

上述代碼中，第3行代碼根據(jù)id屬性值獲取button按鈕的元素對(duì)象。第4~7行代碼追過動(dòng)態(tài)綁定式為按鈕添加單擊事件。其中，事件處理函數(shù)中傳遞的參數(shù)e(參數(shù)名稱只要符合變量定義的規(guī)則即可)表示的就是事件對(duì)象event。第5行通過“或”運(yùn)算符實(shí)現(xiàn)不同瀏覽器間獲取事件對(duì)象兼容的處理。若是標(biāo)準(zhǔn)瀏覽器，則可以直接通過e獲取事件對(duì)象;若是早期版本的IE瀏覽器(IE6~IE8)則需要通過window.event才能獲取事件對(duì)象。

最后執(zhí)行第6行代碼，在控制臺(tái)查看事件對(duì)象。在IE11的開發(fā)人員工具中，通過IE8兼容模式測試，效果如圖7-17(a)所示。在Chrome瀏覽器中的效果如圖7-17(b)所示。