DOM事件學習筆記

2021-07-12 04:22:19 字數 1356 閱讀 9273

1.事件處理程式

(1)html事件處理程式

function showmessage()

缺點:要修改兩次

(2)dom的0級事件處理程式

var btn=document.getelementbyid("btn");

btn.οnclick=function()

btn.οnclick=null;     //刪除事件

(3)dom的2級事件處理程式  //ie8以下不支援 (除ie和opera外)

btn.addeventlistener('click',showmessage,false);

btn.addeventlistener('click',function(),false);    //另一種寫法

btn.removeeventlistener('click',showmessage,false);    //刪除事件

0級和2級兩者有共同的優點,即可以新增多個事件。

(4)ie事件處理程式   //ie和opera

btn.attachevent('onclick',showmessage);    //注意這裡是onclick而不是2級裡的click

btn.detachevent('onclick',showmessage);

(5)跨瀏覽器的事件處理程式

//element.οnclick===element[onclick] 二者等價

原理:將多種事件處理程式封裝起來,瀏覽器支援哪種事件處理方式就執行哪種。

2.dom物件

屬性:type,target

function showmessage(event)

function stopgoto(event)

3. ie中的事件物件

屬性:type,srcelement

阻止事件冒泡:srcelement屬性為true時阻止冒泡

阻止事件預設行為:returnvalue屬性為false時阻止預設行為

4.鍵盤事件

(1)keydown 按下任意鍵時觸發,若按住不放,將重複觸發此事件;

(2)keypress 按下字元鍵時觸發,若按住不放,將重複觸發此事件;

(3)keyup 釋放鍵盤上的鍵時觸發。

每個鍵都有特定的鍵碼值。

學習筆記 DOM物件及事件繫結

目錄四 element物件 五 對dom物件的操作 六 調整元素樣式的方式 七 event物件 2 繫結事件的幾種方法 dom的英文全稱是document object model,即文件物件模型,是用以操作html文件和xml文件的api。w3c將dom分為三個不同的部分,分別是 核心dom,xm...

DOM 事件(鍵盤事件)

onkeydown 事件會在使用者按下乙個鍵盤按鍵時發生。onkeydown onkeypress onkeyup onkeydown事件在很多小遊戲上應用較多,比如需要控制上下左右的很多遊戲,如2048,貪吃蛇,俄羅斯方塊等等。keydown function bind this 然後就可以通過鍵...

Dom事件鍵盤事件

dom0級事件元素繫結多個 click 最後只執行最後乙個 click dom2級事件元素繫結多個 click 都要執行 注意當繫結的多個事件名,函式名,事件發生階段三者完全一樣時,才執行最後乙個 div.addeventlistener click fn1,false div.addeventli...