事件：就是網(wǎng)頁瀏覽者或者瀏覽器所作出的某些操作 如點擊鼠標 敲擊鍵盤 刷新頁面
事件處理程序 所謂事件處理程序就是指事件被觸發(fā)后要執(zhí)行的函數(shù)肯夏，
有自己的名字 該名字由on加事件名稱構(gòu)成 on click onclick
注意:事件處理程序的名稱都是小寫
事件處理程序的添加方式:HTML事件處理程序
HTML事件處理程序 事件處理程序直接寫在開始標簽中 不常用
DOM0級事件處理程序
事件處理程序后面直接加一個匿名函數(shù)
節(jié)點.onclick=function(){console.log("hello");}
事件處理程序后面加一個函數(shù)名稱,節(jié)點.onclick = fn;
DOM0級事件處理程序添加時的注意事件
同種節(jié)點,如果要添加的事件是相同的,
**DOM0級事件處理程序的刪除方式 事件名.onclick(事件處理程序名稱) = null;
oDiv.onclick = null;
DOM2級事件處理程序的添加 用addEventListener函數(shù)
節(jié)點.addEventListener("事件名",要執(zhí)行的函數(shù)名,事件流)
第一個參數(shù)事件名必須由雙引號包起來，事件名不加on
第二個參數(shù)為要執(zhí)行的函數(shù)名，不需雙引號包起來,注意函數(shù)名后面不加括號
第三個參數(shù)為事件流 值為true 或 false
如果要給同一個節(jié)點添加多個事件且事件名相同,那么后添加的事件會覆蓋先添加的事件
DOM2級事件處理程序的刪除嫡良，removeEventListener方法
節(jié)點.removeEventListener("事件名",要執(zhí)行的函數(shù)名,事件流)蝎困；
所謂的事件流 就是事件的執(zhí)行順序 有兩種形式: 事件捕獲 事件冒泡
(同種事件時涉及到事件流 冒泡 捕獲)
事件捕獲 事件的執(zhí)行順序為大到小
事件冒泡 事件的執(zhí)行順序為小到大
事件流的注意事項
DOM0級事件處理程序只支持事件冒泡卿拴，DOM2級事件處理程序支持事件捕獲和事件冒泡
DOM2級事件處理程序在添加時如果第三個參數(shù)為true 表示事件捕獲,如果為false表示事件冒泡
第三個值省略默認為事件冒泡
常見的事件
onload 當頁面中所有標簽都加載完成后觸發(fā)該事件
onunload 頁面關(guān)閉時觸發(fā)(頁面被卸載時) 只IE支持
onresize 節(jié)點尺寸被更改時觸發(fā)
onscroll 滾動條拖動時觸發(fā)
鼠標
onselect 文本框中內(nèi)容被選中觸發(fā)
- onchange 域中內(nèi)容被改變時觸發(fā)(selsect下拉菜單的值改變時,就是選下拉里的選項時)
onfocus 表單元素獲取焦點時觸發(fā)
onblur 表單元素失去焦點時觸發(fā)
onsubmit 表單中提交按鈕點擊時觸發(fā) 加在form標簽中
onreset 當表單中的重置按鈕點擊時觸發(fā) 加在form標簽中
onclick 節(jié)點被鼠標單擊時觸發(fā)
ondblclick 當節(jié)點被鼠標左鍵雙擊時觸發(fā)
onmousedown 鼠標被壓下去觸發(fā)
onmouseup 鼠標被松開時觸發(fā)
onmouseover 鼠標從某個元素移入是觸發(fā)
onmouseout 鼠標從某個元素移出是觸發(fā)
onmousemove 鼠標在某個元素上移動時觸發(fā)
鍵盤
onkeydown 鍵盤按鍵被按下去時觸發(fā) 識別所有按鍵
onkeyup 鍵盤上的按鍵被松開時觸發(fā)
onkeypress 同onkeydown 但是只識別字符(字母)按鈕
***event對象 不需要手動創(chuàng)建 當給某個元素添加事件時瀏覽器自動創(chuàng)建該對象长已，該對象的作用是記錄當前事件的相關(guān)屬性和信息技俐。該對象會以參數(shù)的形式傳遞給事件函數(shù)旋恼，注意地方是event對象存在兼容問題吏口，在谷歌瀏覽器和火狐瀏覽器中event對象是以事件函數(shù)的參數(shù)形式接收,但是在IE瀏覽器中even對象則是window對象的屬性形式保留 所以用下面代碼達到兼容
var e = eve || window.event
event對象常用的屬性和方法
屬性
cancelable
bubbles
type
target 當前事件被觸發(fā)
currentTarget
***
keyCode 返回鍵盤按鍵的編碼(鍵碼)，注意編碼不是ASCII碼
ctrlKey 判斷是否按壓了Ctrl鍵 如果是,結(jié)果為true否則為false
altKey 判斷是否按壓了alt鍵。如果是,結(jié)果為true否則為false
shiftKey 判斷是否按壓了shiftKey鍵产徊。如果是,結(jié)果為true否則為false
*****
screenX 獲取當前鼠標點擊的位置距離屏幕左端的距離 數(shù)值型
screenY 獲取當前鼠標點擊的位置距離屏幕上端的距離 數(shù)值型
clientX 獲取當前鼠標點擊的位置距離瀏覽器左端的距離 數(shù)值型
clientY 上
offsetX 獲取當前鼠標點擊的位置距離元素左端的距離 數(shù)值型
offsetY 上
方法
preventDefault() 作用是:取消元素的默認行為
stopPropagation() 取消阻斷冒泡
oncontextmenu 右鍵彈出菜單
preventDefault siblings siblings siblings siblings siblings siblings siblings
closest closest closest closest closest closest closest siblings siblings
