本文為大家總結了JS DOM的常用事件，具有一定的參考價值，有興趣的夥伴們可以參考一下。
click 點選dblclick 雙擊contextmenu 右鍵點選mouseover 滑鼠懸停在元素上，建議用mouseenter 取代mouseout 滑鼠離開元素，建議用mouseleave 取代mouseenter 滑鼠懸停在元素上mouseleave 滑鼠離開元素，建議用mouseleave 取代mouseenter 滑鼠停留在元素上mouseleave 滑鼠離開元素 mousedown 滑鼠鍵按下mouseup 滑鼠按鍵可抬起mousemove 滑鼠移動
keydown 鍵盤按鍵按下keyup 鍵盤按鍵可抬起keypress 鍵盤按鍵按下，用於可輸入字元按鍵
1. 哪些元素可以監聽鍵盤事件？
① document
② 可以取得焦點的元素（表單控件，尤其是可輸入的元素）
2. keydown 和keypress 的區別？
① keydown 所有的按鍵按下都可以觸發，無法區分大小寫按鍵。
② keypress 只有可輸入字元按鍵按下才可以觸發，可以區分大小寫按鍵。
3. 如何取得按下的是哪個按鍵？
使用event 物件中的屬性：
evnet.keyCode 取得按鍵對應的ascii 值
event.which 同keyCode
event.key 取得按鍵的字元值。
load 頁面中所有的一切加載完畢就會觸發，可以監聽到window上或body元素DOMContentLoaded 頁面中所有的元素加載完畢就會觸發，可以監聽在window或document上，只能使用addEventListener 監聽事件beforeunload當關閉網頁的時候觸發
load 事件與DOMContentLoaded 事件的區別：
① load 事件是頁面中所有的一切加載完畢才能觸發，包括元素以及外部資源。
② DOMContentLoaded 事件是頁面中所有的元素載入完畢就可以觸發，不包含外部資源。
submit 當表單提交的時候觸發，該事件監聽到form元素 reset 當表單重置的時候觸發，該事件監聽到form元素focus 當表單控制項獲取焦點的時候觸發blur 當表格控制項單失去焦點的時候觸發select 輸入框或文字域中的內容被選中change 對於輸入框，內容改變且失去焦點才會觸發；適合用於select
load 圖片檔案下載完畢error 圖片載入失敗
resize 監聽到window上，視口大小發生改變scroll 監聽到window或是具有滾動體的元素，頁面或元素中的內容發生滾動就觸發。
給事件的回呼函數設定第一個形參，就可以取得event 物件。
不同類型的事件所取得的Event 物件類型也不同。
offsetX / offsetY 取得滑鼠在目標元素上的座標位置clientX / clientY 取得滑鼠在視窗上的座標位置pageX / pageY 取得滑鼠在頁面上的座標位置screenX / screenY 取得滑鼠在螢幕上的座標位置button 取得按的是哪個滑鼠按鍵， 0：左鍵；1:中間鍵; 2: 右鍵
keyCode 取得按鍵對應的編碼值which 同keyCode key 取得按鍵對應的字元值
type 取得事件名稱timeStamp 取得觸發事件時距離開啟頁面時的毫秒數target 取得目標元素stopPropagation() 阻止事件冒泡preventDefault() 阻止瀏覽器預設行為
在事件的回呼函數中執行event.stopPropagation() ，就可以阻止冒泡。
超連結點擊跳轉表單的提交和重設右鍵彈出系統選單等...
在事件的回呼函數中呼叫event.preventDefault()即可阻止預設行為。
注意：如果使用第二種方式監聽事件，在回呼函數中
return false同樣可以阻止預設行為。
事件監聽到祖先元素上，判斷目標元素，如果目標元素滿足條件，就執行相關操作。
事件委託的優點：
對於給予大量的元素監聽相同的事件，使用事件委託比遍歷挨個監聽效率更好。
利用事件委託可以讓新增的元素也可以回應事件。
相關推薦：【JavaScript影片教學】
以上就是JavaScript DOM 常用事件最新總結！的詳細內容，更多請關注php中文網其它相關文章！
