事件

javaScript 與 HTML 之間的交互是通過事件實現(xiàn)的

1.事件流

(1)事件冒泡

IE 的事件流叫做事件冒泡（event bubbling），即事件開始時由最具體的元素（文檔中嵌套層次最深的那個節(jié)點）接收，然后逐級向上傳播到較為不具體的節(jié)點（文檔）

(2)事件捕獲

事件捕獲的思想是不太具體的節(jié)點應該更早接收到事件，而最具體的節(jié)點應該最后接收到事件

(3)事件代理

事件委托就是利用事件冒泡，只指定一個事件處理程序，就可以管理某一類型的所有事件

//監(jiān)聽ul下所有的li的事件
window.onload = function(){
　　var oUl = document.getElementById("ul1");
　　oUl.onclick = function(ev){
　　　　var ev = ev || window.event;
　　　　var target = ev.target || ev.srcElement;
　　　　if(target.nodeName.toLowerCase() == 'li'){
　 　　　　　　    alert(123);
　　　　　　　  alert(target.innerHTML);
　　　　}
　　}
}

2.事件處理程序

某個事件的函數(shù)就叫做事件處理程序

(1)HTML事件處理程序

(2)DOM0 級事件處理程序

每個元素（包括 window 和 document）都有自己的事件處理程序屬性，這些屬性通常全部小寫，例如 onclick。

(3)DOM2 級事件處理程序

“DOM2 級事件” 定義了兩個方法，用于處理指定和刪除事件處理程序的操作：
addEventListener()和 removeEventListener()。

//跨瀏覽器的事件處理程序
var EventUtil = {
    addHandler: function(element, type, handler){
        if (element.addEventListener){
            element.addEventListener(type, handler, false);
        } else if (element.attachEvent){
            element.attachEvent("on" + type, handler);
        } else {
            element["on" + type] = handler;
        }
    },
    removeHandler: function(element, type, handler){
        if (element.removeEventListener){
            element.removeEventListener(type, handler, false);
        } else if (element.detachEvent){
            element.detachEvent("on" + type, handler);
        } else {
            element["on" + type] = null;
        }
    }
};

3.事件對象

在觸發(fā) DOM 上的某個事件時，會產(chǎn)生一個事件對象 event，這個對象中包含著所有與事件有關的信息。包括導致事件的元素、事件的類型以及其他與特定事件相關的信息。例如，鼠標操作導致的事件
屬性和方法
preventDefault() 取消事件的默認行為
stopPropagation() 取消事件冒泡

4.事件類型

(1)UI事件

load,unLoad,abord,error,select,resize,scroll

(2)焦點事件

blur //在元素失去焦點時觸發(fā)。這個事件不會冒泡；所有瀏覽器都支持它。
focus
focusin：在元素獲得焦點時觸發(fā)。這個事件與 HTML 事件 focus 等價，但它冒泡
focusout

(3)鼠標事件

click,dbclick,mousedown,mouseenter,mouseleave,mousemove,mouseout,mouseover,mouseup

(4)鍵盤事件