事件的定義
當對文檔中的元素進行操作的時候或者文檔的狀態發生改變的時候會產生一個事件
事件的三要素
事件源
事件
事件處理程序
準備知識
document.getElementById
document.getElementsByTagName
innerHTML
style
1.只能對行內樣式進行操作
2.backgroundColor 有橫杠的css樣式要使用駝峰命名法
綁定事件
1.在html標簽元素中 onclick='函數名()'
2.使用元素對象的方式
事件驅動
鼠標事件
onclick 單擊事件
ondblclick 雙擊事件
onmouseover 鼠標移入
onmouseout 鼠標移出
oncontextmenu 鼠標右擊
onmousedown 鼠標按下
onmouseup 鼠標抬起
onmousemove 鼠標移動
scrollTopt 將內容進行縱向移動
scrollLeft 將內容進行橫向移動
鍵盤事件
onkeydown 鍵盤按下
keyCode 獲取鍵盤按下的ASCII的值（不區分大小寫）
ctrlKey 判斷鍵盤ctrl鍵是否被按下
altKey 判斷鍵盤alt鍵是否被按下
shiftKey 判斷shift是否被按下
onkeypress 按下抬起
獲取鍵盤按下的ASCII值（區分大小寫，不識別系統按鍵）
onkeyup 鍵盤抬起
表單事件
onfocus 聚焦
onblur 失去焦點
案例 驗證用戶名
onsubmit 表單提交事件
onchange 當值發生改變的時候
onreset 表單重置
onselect 文本域的內容被選中的時候觸發的時候
框架事件
onload 當網頁內容加載完成之后
onerror 文檔加載失敗的時候
onscroll 當網頁發生滾動的時候
document.body.scrollTop 獲取滾動高度（谷歌）
document.body.scrollLeft 獲取滾動寬度(谷歌)
document.documentElement.scrollTop 獲取滾動高度IE
兼容
// 兼容火狐谷歌IE
var top = document.body.scrollTop || document.documentElement.scrollTop;
案例：window.onscroll = function(){
// 谷歌獲取滾動的距離
// var top = document.body.scrollTop;
// var left = document.body.scrollLeft;

// 火狐IE中獲取的滾動距離
// var top = document.documentElement.scrollTop;

// 兼容火狐谷歌IE
var top = document.body.scrollTop || document.documentElement.scrollTop;
alert(top);
}
阻止冒泡
cancelBubble 使用e對象的方式進行阻止
擴展知識
onbeforeunload
當頁面要被關閉的時候執行的代碼
//這里必須要寫成return的形式 不能寫alert
禁止a鏈接跳轉的事件綁定
<a href="javascript:;" id='box'>點擊我試試</a>
<a href="javascript:void(0)" onclick="demo()">點擊我試試</a>
<a href="www.baidud.conm" onclick="return false">點擊我試試</a>

相關文章：

JavaScript中綁定事件的三種方式及去除綁定

詳解js中的綁定事件和解綁事件

聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com