發(fā)送DOM事件是為了將發(fā)生的有趣事情通知代碼。
事件通常與功能結(jié)合使用,并且在事件發(fā)生之前(例如,用戶單擊按鈕時)不會執(zhí)行該功能。
事件可以表示一切,從基本的用戶交互到呈現(xiàn)模型中發(fā)生的事情的自動通知。
活動名稱 | 描述 | 事件類型 |
---|---|---|
abort | 當資源加載已中止時發(fā)生該事件 | UiEvent, Event |
afterprint | 當相關(guān)文檔已開始打印或打印預(yù)覽已關(guān)閉時,發(fā)生此事件 | Event |
animationend | CSS動畫完成時發(fā)生 | AnimationEvent |
animationiteration | 重復(fù)CSS動畫時發(fā)生此事件 | AnimationEvent |
animationstart | CSS動畫開始時發(fā)生此事件 | AnimationEvent |
beforeprint | 當相關(guān)文檔將要打印或預(yù)覽以進行打印時,將發(fā)生此事件 | Event |
beforeunload | 當窗口,文檔及其資源即將被卸載時發(fā)生該事件 | UiEvent, Event |
blur | 當元素失去焦點(不會冒泡)時發(fā)生該事件 | FocusEvent |
canplay | 當瀏覽器可以開始播放媒體時(當它有足夠的緩沖來開始播放時),將發(fā)生此事件。 | Event |
canplaythrough | 當瀏覽器可以在不停止緩沖的情況下播放媒體時發(fā)生此事件 | Event |
change | 當表單元素,選擇或選中狀態(tài)的內(nèi)容更改時(對于<input>,<select>和<textarea>),將發(fā)生此事件。 | Event |
click | 當用戶單擊元素時發(fā)生事件 | MouseEvent |
contextmenu | 當用戶右鍵單擊某個元素以打開上下文菜單時,將發(fā)生該事件 | MouseEvent |
copy | 當用戶復(fù)制元素的內(nèi)容時發(fā)生該事件 | ClipboardEvent |
cut | 當用戶剪切元素的內(nèi)容時發(fā)生該事件 | ClipboardEvent |
dblclick | 當用戶雙擊元素時發(fā)生事件 | MouseEvent |
drag | 拖動元素時發(fā)生事件 | DragEvent |
dragend | 當用戶完成拖動元素時,發(fā)生該事件 | DragEvent |
dragenter | 當拖動的元素進入放置目標時,將發(fā)生事件 | DragEvent |
dragleave | 當拖動的元素離開放置目標時發(fā)生事件 | DragEvent |
dragover | 當拖動的元素在放置目標上方時發(fā)生事件 | DragEvent |
dragstart | 當用戶開始拖動元素時發(fā)生該事件 | DragEvent |
drop | 當將拖動的元素放置在放置目標上時,發(fā)生事件 | DragEvent |
durationchange | 更改媒體的持續(xù)時間時發(fā)生此事件 | Event |
ended | 該事件在媒體播放到盡頭時發(fā)生(對于“感謝收聽”之類的消息很有用) | Event |
error | 資源加載失敗時發(fā)生 | ProgressEvent, UiEvent, Event |
focus | 當元素已獲得焦點時發(fā)生事件(不會冒泡) | FocusEvent |
focusin | 該事件在某個元素即將獲得焦點時發(fā)生 | FocusEvent |
focusout | 該事件在某個元素即將失去焦點時發(fā)生 | FocusEvent |
fullscreenchange | 以全屏模式顯示元素時發(fā)生事件 | Event |
fullscreenerror | 當元素無法以全屏模式顯示時,發(fā)生此事件 | Event |
hashchange | 當URL的錨點部分發(fā)生更改時,將發(fā)生此事件 | HashChangeEvent |
input | 當元素獲得用戶輸入時發(fā)生事件 | InputEvent, Event |
invalid | 當元素無效時發(fā)生 | Event |
keydown | 該事件在用戶按下某個鍵時發(fā)生 | KeyboardEvent |
keypress | 當用戶按下鍵時發(fā)生事件 | KeyboardEvent |
keyup | 當用戶釋放鍵時發(fā)生該事件 | KeyboardEvent |
load | 該事件在對象已加載時發(fā)生 | UiEvent, Event |
loadeddata | 加載媒體數(shù)據(jù)時發(fā)生事件 | Event |
loadedmetadata | 加載元數(shù)據(jù)(如維度和持續(xù)時間)時發(fā)生此事件 | Event |
loadstart | 當瀏覽器開始查找指定的媒體時發(fā)生該事件 | ProgressEvent |
message | 通過事件源接收到消息時發(fā)生事件 | Event |
mousedown | 當用戶在元素上按下鼠標按鈕時,發(fā)生事件 | MouseEvent |
mouseenter | 當指針移動到元素上時,發(fā)生該事件 | MouseEvent |
mouseleave | 當指針從元素中移出時發(fā)生該事件 | MouseEvent |
mousemove | 當指針在元素上方移動時發(fā)生該事件 | MouseEvent |
mouseover | 當指針移動到元素或其子元素之一上時,發(fā)生此事件 | MouseEvent |
mouseout | 當用戶將鼠標指針移出某個元素或其子元素之一時,將發(fā)生此事件 | MouseEvent |
mouseup | 當用戶在元素上釋放鼠標按鈕時發(fā)生該事件 | MouseEvent |
mousewheel | 不推薦使用。改用wheel事件 | WheelEvent |
offline | 當瀏覽器開始脫機工作時發(fā)生該事件 | Event |
online | 當瀏覽器開始在線工作時發(fā)生該事件 | Event |
open | 打開與事件源的連接時,將發(fā)生該事件 | Event |
pagehide | 當用戶離開網(wǎng)頁導航時發(fā)生該事件 | PageTransitionEvent |
頁面顯示 | 當用戶導航到網(wǎng)頁時發(fā)生事件 | PageTransitionEvent |
paste | 當用戶將某些內(nèi)容粘貼到元素中時,發(fā)生該事件 | ClipboardEvent |
pause | 當用戶或以編程方式暫停媒體時,將發(fā)生該事件 | Event |
play | 當媒體已啟動或不再暫停時發(fā)生該事件 | Event |
playing | 在暫?;蛲V咕彌_媒體后播放媒體時發(fā)生該事件 | Event |
popstate | 窗口的歷史記錄更改時發(fā)生該事件 | PopStateEvent |
progress | 當瀏覽器正在獲取媒體數(shù)據(jù)(下載媒體)的過程中發(fā)生該事件 | Event |
ratechange | 更改媒體的播放速度時發(fā)生 | Event |
resize | 調(diào)整文檔視圖大小時發(fā)生此事件 | UiEvent, Event |
reset | 該事件在重置表單時發(fā)生 | Event |
scroll | 滾動元素的滾動條時發(fā)生事件 | UiEvent, Event |
search | 當用戶在搜索字段中輸入內(nèi)容時(對于<input="search">),將發(fā)生此事件。 | Event |
seeked | 當用戶完成移動/跳至媒體中的新位置時發(fā)生該事件 | Event |
seeking | 當用戶開始移動/跳到媒體中的新位置時發(fā)生該事件 | Event |
select | 用戶選擇某些文本(對于<input>和<textarea>)后,將發(fā)生此事件。 | UiEvent, Event |
show | 當<menu>元素顯示為上下文菜單時,事件發(fā)生 | Event |
stalled | 當瀏覽器嘗試獲取媒體數(shù)據(jù)但數(shù)據(jù)不可用時,發(fā)生該事件 | Event |
storage | 更新Web存儲區(qū)域時發(fā)生該事件 | StorageEvent |
submit | 該事件在提交表單時發(fā)生 | Event |
suspend | 當瀏覽器有意不獲取媒體數(shù)據(jù)時發(fā)生此事件 | Event |
timeupdate | 當播放位置更改時(例如,當用戶快速前進到媒體中的另一個點時)發(fā)生該事件 | Event |
toggle | 該事件在用戶打開或關(guān)閉<details>元素時發(fā)生 | Event |
touchcancel | 該事件在觸摸被中斷時發(fā)生 | TouchEvent |
touchend | 當手指從觸摸屏上移開時發(fā)生該事件 | TouchEvent |
touchmove | 當手指在屏幕上拖動時發(fā)生事件 | TouchEvent |
touchstart | 當手指放在觸摸屏上時發(fā)生事件 | TouchEvent |
transitionend | CSS轉(zhuǎn)換完成時發(fā)生此事件 | TransitionEvent |
unload | 該事件在文檔或從屬資源被卸載時發(fā)生 | UiEvent, Event |
volumechange | 當媒體的音量已更改(包括將音量設(shè)置為“靜音”)時發(fā)生該事件 | Event |
waiting | 當媒體已暫停但預(yù)期會恢復(fù)時(如媒體暫停以緩沖更多數(shù)據(jù)時),將發(fā)生此事件 | Event |
wheel | 當鼠標滾輪在元素上向上或向下滾動時,會發(fā)生此事件 | WheelEvent |
下表列出了DOM事件的屬性:
屬性 | 描述 | 事件類型 |
---|---|---|
altKey | 返回在觸發(fā)鼠標事件時是否按下了“ ALT”鍵 | MouseEvent |
altKey | 返回觸發(fā)鍵事件時是否按下了“ ALT”鍵 | KeyboardEvent, TouchEvent |
animationName | 返回動畫的名稱 | AnimationEvent |
bubbles | 返回特定事件是否為冒泡事件 | Event |
button | 返回觸發(fā)鼠標事件時按下的鼠標按鈕 | MouseEvent |
buttons | 返回觸發(fā)鼠標事件時按下的鼠標按鈕 | MouseEvent |
cancelable | 返回事件是否可以阻止其默認操作 | Event |
charCode | 返回觸發(fā)onkeypress事件的鍵的Unicode字符代碼 | KeyboardEvent |
changeTouches | 返回狀態(tài)在上一次觸摸和此觸摸之間改變的所有觸摸對象的列表 | TouchEvent |
clientX | 返回觸發(fā)鼠標事件時鼠標指針相對于當前窗口的水平坐標 | MouseEvent, TouchEvent |
clientY | 返回觸發(fā)鼠標事件時鼠標指針相對于當前窗口的垂直坐標 | MouseEvent, TouchEvent |
clipboardData | 返回一個對象,其中包含受剪貼板操作影響的數(shù)據(jù) | ClipboardData |
code | 返回觸發(fā)事件的鍵的代碼 | KeyboardEvent |
composed | 返回事件是否組成 | Event |
ctrlKey | 返回觸發(fā)鼠標事件時是否按下了“ CTRL”鍵 | MouseEvent |
ctrlKey | 返回觸發(fā)鍵事件時是否按下了“ CTRL”鍵 | KeyboardEvent, TouchEvent |
currentTarget | 返回其事件偵聽器觸發(fā)事件的元素 | Event |
data | 返回插入的字符 | InputEvent |
dataTransfer | 返回一個對象,其中包含要拖放/插入或刪除的數(shù)據(jù) | DragEvent, InputEvent |
defaultPrevented | 返回是否為事件調(diào)用preventDefault()方法 | Event |
deltaX | 返回鼠標滾輪的水平滾動量(x軸) | WheelEvent |
deltaY | 返回鼠標滾輪的垂直滾動量(y軸) | WheelEvent |
deltaZ | 返回Z軸的鼠標滾輪的滾動量 | WheelEvent |
deltaMode | 返回一個數(shù)字,表示增量值(像素,線條或頁面)的度量單位 | WheelEvent |
detail | 返回一個數(shù)字,該數(shù)字指示鼠標被單擊了多少次 | UiEvent |
elapsedTime | 返回動畫已運行的秒數(shù) | AnimationEvent |
elapsedTime | 返回過渡已運行的秒數(shù) | |
eventPhase | 返回當前正在評估事件流的哪個階段 | Event |
inputType | 返回更改的類型(即“插入”或“刪除”) | InputEvent |
isComposing | 返回事件的狀態(tài)是否正在組成 | InputEvent, KeyboardEvent |
isTrusted | 返回事件是否受信任 | Event |
key | 返回事件表示的鍵的鍵值 | KeyboardEvent |
key | 返回更改的存儲項目的密鑰 | StorageEvent |
keyCode | 返回觸發(fā)onkeypress事件的鍵的Unicode字符代碼,或觸發(fā)onkeydown或onkeyup事件的鍵的Unicode鍵代碼。 | KeyboardEvent |
location | 返回鍵盤或設(shè)備上按鍵的位置 | KeyboardEvent |
lengthComputable | 返回進度的長度是否可以計算 | ProgressEvent |
loaded | 返回已加載的工作量 | ProgressEvent |
metaKey | 返回事件觸發(fā)時是否按下了“ META”鍵 | MouseEvent |
metaKey | 返回在觸發(fā)鍵事件時是否按下了“元”鍵 | KeyboardEvent, TouchEvent |
MovementX | 返回相對于上一個mousemove事件的位置的鼠標指針的水平坐標 | MouseEvent |
MovementY | 返回相對于上一個mousemove事件的位置的鼠標指針的垂直坐標 | MouseEvent |
newValue | 返回更改后的存儲項目的新值 | StorageEvent |
newURL | 更改哈希值后,返回文檔的URL | HasChangeEvent |
offsetX | 返回鼠標指針相對于目標元素邊緣位置的水平坐標 | MouseEvent |
offsetY | 返回鼠標指針相對于目標元素邊緣位置的垂直坐標 | MouseEvent |
oldValue | 返回已更改存儲項目的舊值 | StorageEvent |
oldURL | 返回哈希更改之前的文檔的URL | HasChangeEvent |
onemptied | 當發(fā)生不良情況并且媒體文件突然不可用(例如意外斷開連接)時,將發(fā)生此事件 | |
pageX | 返回觸發(fā)鼠標事件時鼠標指針相對于文檔的水平坐標 | MouseEvent |
pageY | 返回觸發(fā)鼠標事件時鼠標指針相對于文檔的垂直坐標 | MouseEvent |
persisted | 返回網(wǎng)頁是否被瀏覽器緩存 | PageTransitionEvent |
propertyName | 返回與動畫或過渡相關(guān)聯(lián)的CSS屬性的名稱 | AnimationEvent, TransitionEvent |
pseudoElement | 返回動畫或過渡的偽元素的名稱 | AnimationEvent, TransitionEvent |
region | MouseEvent | |
relatedTarget | Returns the element related to the element that triggered the mouse event | MouseEvent |
relatedTarget | 返回與觸發(fā)事件的元素相關(guān)的元素 | FocusEvent |
repeat | 返回是否重復(fù)按住某個鍵 | KeyboardEvent |
screenX | 返回觸發(fā)事件時鼠標指針相對于屏幕的水平坐標 | MouseEvent |
screenY | 返回觸發(fā)事件時鼠標指針相對于屏幕的垂直坐標 | MouseEvent |
shiftKey | 返回事件觸發(fā)時是否按下了“ SHIFT”鍵 | MouseEvent |
shiftKey | 返回觸發(fā)鍵事件時是否按下了“ SHIFT”鍵 | KeyboardEvent, TouchEvent |
state | 返回一個包含歷史記錄條目副本的對象 | PopStateEvent |
storageArea | 返回一個表示受影響的存儲對象的對象 | StorageEvent |
target | 返回觸發(fā)事件的元素 | Event |
targetTouches | 返回所有與該表面接觸以及touchstart事件發(fā)生在與當前目標元素相同的目標元素上的觸摸對象的列表 | TouchEvent |
timeStamp | 返回創(chuàng)建事件的時間(相對于紀元的毫秒數(shù)) | Event |
total | 返回將要加載的工作總量 | ProgressEvent |
touches | 返回當前與曲面接觸的所有觸摸對象的列表 | TouchEvent |
transitionend | CSS轉(zhuǎn)換完成時發(fā)生此事件 | TransitionEvent |
type | 返回事件的名稱 | Event |
url | 返回更改項目文檔的URL | StorageEvent |
which | 返回觸發(fā)鼠標事件時按下的鼠標按鈕 | MouseEvent |
which | 返回觸發(fā)onkeypress事件的鍵的Unicode字符代碼,或觸發(fā)onkeydown或onkeyup事件的鍵的Unicode鍵代碼。 | KeyboardEvent |
view | 返回對發(fā)生事件的Window對象的引用 | UiEvent |
下表列出了DOM事件的方法:
方法 | 描述 | 事件類型 |
---|---|---|
createEvent() | 創(chuàng)建一個新事件 | Event |
getTargetRanges() | 返回一個包含目標范圍的數(shù)組,該范圍將受到插入/刪除的影響 | InputEvent |
getModifierState() | 返回一個包含目標范圍的數(shù)組,該范圍將受到插入/刪除的影響 | MouseEvent |
preventDefault() | 阻止瀏覽器執(zhí)行所選元素的默認操作 | Event |
stopImmediatePropagation() | 防止同一事件的其他偵聽器被調(diào)用 | Event |
stopPropagation() | 防止事件在事件流中進一步傳播 | Event |
Javascript教程:Javascript事件
Javascript教程:事件監(jiān)聽器
Javascript教程:事件傳播