事件：分為兩部分
1谦趣、行為本身：瀏覽器天生就賦予其的行為：onmouseover（onmouserenter）、onmouseout（onmouseleave）月趟、onmousemove郑临、onmousedown熙涤、onmouseup崎页、onmousewheel（鼠標(biāo)滾輪滾動(dòng)行為）鞠绰、onscroll（滾動(dòng)條滾動(dòng)行為）、onresize（window.onresize瀏覽器窗口的大小改變事件）飒焦、onload蜈膨、onunload、onfocus（文本框獲取焦點(diǎn)行為）牺荠、onblur（文本框失去焦點(diǎn)）翁巍、onkeydown、onkeyup（鍵盤(pán)的按下和抬起行為）...
哪怕沒(méi)有給上述的行為綁定方法休雌，事件也是存在的灶壶，當(dāng)我們點(diǎn)擊的時(shí)候，同樣會(huì)觸發(fā)它的onclick行為杈曲，只是什么事情都沒(méi)做而已
2驰凛、事件綁定：給元素的某一個(gè)行為綁定方法
var oDiv=document.getElementById("div1");
//-->方法1：onclick這個(gè)行為定義在當(dāng)前元素的私有屬性上
oDiv.onclick=function(){
//-->當(dāng)我們觸發(fā)oDiv的click行為的時(shí)候，會(huì)把綁定的這個(gè)函數(shù)執(zhí)行
};
//-->方法2：addEventListener這個(gè)屬性是定義在當(dāng)前元素所屬EventTarget這個(gè)類(lèi)的原型上的
//addEventListener--->第一個(gè)參數(shù)是行為的類(lèi)型鱼蝉，第二個(gè)參數(shù)是給當(dāng)前的行為綁定的方法洒嗤，第三個(gè)參數(shù)是控制在哪個(gè)階段發(fā)生：true（在捕獲階段發(fā)生） false（在冒泡階段發(fā)生）
oDiv.addEventListener("click",function(){
console.log("ok");
},false);
方法2這種稱為：DOM 2級(jí)事件綁定
onclick這種綁定方式稱為：DOM 0級(jí)事件綁定
把匿名函數(shù)定義的部分當(dāng)做一個(gè)值賦值給oDiv的點(diǎn)擊行為（函數(shù)表達(dá)式），當(dāng)觸發(fā)#div1的點(diǎn)擊行為的時(shí)候魁亦，會(huì)執(zhí)行對(duì)應(yīng)綁定上的方法
重要：不僅僅把綁定的方法執(zhí)行了，而且瀏覽器還默認(rèn)給這個(gè)方法傳遞了一個(gè)參數(shù)值MouseEvent：鼠標(biāo)事件對(duì)象
（1）它是一個(gè)對(duì)象數(shù)據(jù)類(lèi)型值羔挡，里面包含了很多的屬性和屬性值洁奈，這些都是用來(lái)記錄當(dāng)前鼠標(biāo)的相關(guān)信息的
（2）MouseEvent-->UIEvent-->Event-->Object
（3）MouseEvent記錄的是頁(yè)面中唯一一個(gè)鼠標(biāo)每一次觸發(fā)時(shí)候的相關(guān)信息，和到底是在哪個(gè)元素上觸發(fā)的沒(méi)有關(guān)系
關(guān)于事件對(duì)象MouseEvent的兼容處理
（1）事件對(duì)象本身的獲取存在兼容問(wèn)題：標(biāo)準(zhǔn)瀏覽器中是瀏覽器給方法傳遞的參數(shù)绞灼，我們只需定義形參e就可以獲取到利术；在IE6-8中瀏覽器不會(huì)給方法傳遞參數(shù)，我們?nèi)绻枰脑挼桶枰絯indow.event中獲取查找----->e=e||window.event;
oDiv.onclick=function(){
e=e||window.event;
//--->e.type:存儲(chǔ)的是當(dāng)前鼠標(biāo)觸發(fā)的行為類(lèi)型 "click"
//--->e.clientX/e.clientY:當(dāng)前鼠標(biāo)觸發(fā)點(diǎn)距離當(dāng)前屏幕左上角的x/y軸的坐標(biāo)值
//---->e.target:事件源印叁，當(dāng)前鼠標(biāo)觸發(fā)的是哪個(gè)元素，那么它存儲(chǔ)的就是哪個(gè)元素，但是在IE6-8中不存在這個(gè)屬性（e.target的值是undefined）轮蜕，我們使用e.srcElement來(lái)獲取事件源
e.target=e.target||e.srcElement;
//--->e.pageX/e.pageY:當(dāng)前鼠標(biāo)觸發(fā)點(diǎn)距離body左上角（頁(yè)面第一屏幕最左上端）的x/y軸的坐標(biāo)值昨悼，但是在IE6-8中沒(méi)有這個(gè)屬性。我們通過(guò)使用clientY+滾動(dòng)條卷去的高度獲取也可以
e.pageX=e.pageX||(e.clientX+(document.documentElement.scrollLeft||document.body.scrollLeft));
e.pageY=e.pageY||(e.clientY+(document.documentElement.scrollTop||document.body.scrollTop));
//--->e.preventDefault:阻止瀏覽器的默認(rèn)行為(如有時(shí)使用a標(biāo)簽跃洛，但點(diǎn)擊時(shí)并不想實(shí)現(xiàn)跳轉(zhuǎn))率触，在IE6-8中沒(méi)有這個(gè)方法，我們需要使用e.returnValue
e.preventDefault?e.preventDefault():e.returnValue=false;//或者用return false也可以阻止默認(rèn)行為汇竭；
//e.stopPropagation:阻止事件的冒泡傳播葱蝗，在IE6-8中不兼容，使用e.cancelBubble=true來(lái)代替
e.stopPropagation?e.stopPropagation():e.cancelBubble=true;
//e.keyCode:當(dāng)前鍵盤(pán)上每一個(gè)鍵對(duì)應(yīng)的值：空格鍵（space）-->32细燎；回退鍵（Backspace）--->8两曼；回車(chē)鍵（Enter）--->13；刪除鍵（Delete）--->46玻驻；四個(gè)方向鍵（左37 上38 右39 下40）
};
事件的傳播機(jī)制：
a悼凑、捕獲階段：從外向里依次查找元素
b、目標(biāo)階段：當(dāng)前事件源本身的操作
c击狮、冒泡階段：從內(nèi)到外依次觸發(fā)相關(guān)的行為（最常用的階段）
使用DOM 0級(jí)事件綁定給元素的某一個(gè)行為綁定的方法佛析，都是在行為觸發(fā)后的冒泡階段把方法執(zhí)行的
onmouseover/onmouseout與onmouseenter/onmouseleave區(qū)別：
都是鼠標(biāo)滑上去的行為，但是onmouseenter瀏覽器默認(rèn)阻止了它的冒泡傳播（這一級(jí)的onmouseenter行為觸發(fā)彪蓬，不會(huì)傳播到它的上一級(jí)）寸莫；
而onmouseover是存在冒泡傳播的，想要阻止的話只能自己寫(xiě)代碼阻止
事件委托(shijiandaili)：
利用事件的冒泡傳播機(jī)制（觸發(fā)當(dāng)前元素的某個(gè)行為档冬，它父級(jí)所有元素的相關(guān)行為都會(huì)被觸發(fā)）膘茎，如果一個(gè)容器中有很多元素都要綁定點(diǎn)擊事件，我們沒(méi)有必要一個(gè)個(gè)的綁定了酷誓，只需要給最外層的容器綁定一個(gè)點(diǎn)擊事件即可披坏，在這個(gè)方法執(zhí)行的時(shí)候，通過(guò)事件源的區(qū)分來(lái)進(jìn)行不同的操作
document.body.onclick=function(e){
e=e||window.event;
e.target=e.target||e.srcElement;
console.log(e.target.id);
}
