js--事件--事件對象

關於事件寫了一系列文章
1.事件流（事件捕獲和事件冒泡）
http://blog.csdn.net/github_34514750/article/details/53067077
2.事件處理程序
http://blog.csdn.net/github_34514750/article/details/53083973
3.事件對象
本文介紹事件對象
4.通用的事件偵聽器函數
http://blog.csdn.net/github_34514750/article/details/53084034
5.事件循環（event loop）
http://blog.csdn.net/github_34514750/article/details/53067106
6.事件代理（(event delegation）
http://blog.csdn.net/github_34514750/article/details/53067133

1.事件對象

觸發DOM上的某個對象時，會產生一個事件對象event

DOM0級事件對象

無論指定事件處理程序時使用什麼方法(DOM0級和DOM2級)，都傳入event對象

阻止特定事件的默認行爲，就是使用preventDefault();

阻止進一步事件的事件捕獲或冒泡，就是使用stopPropagation()

IE中的事件對象

目標：srcElement

阻止特定事件的默認行爲，就是使用returnValue

阻止進一步事件的事件捕獲或冒泡，就是使用cancelBubble

跨瀏覽器的事件對象

var EventUtil = {

    //根據情況分別獲取DOM或者IE中的事件對象，事件目標，阻止事件的默認行爲
    getEvent: function(event) {
        return event ? event : window.event;
    },
    getTarget: function(event) {
        return event.target || event.srcElement;
    },
    preventDefault: function(event) {
        if(event.preventDefault) {
            event.preventDefault();
        } else {
            event.returnValue = false;
        }
    },

    //根據情況分別取消DOM或者IE中事件冒泡
    stopPropagation: function(event) {
        if (event.stopPropagation) {
            event.stopPropagation();
        } else {
            event.cancelBubble = true;
        }
    }
}

var btn = document.getElementById("myBtn");

btn.onclick = function(event) {
    event = EventUtil.getEvent(event);
    var target = EventUtil.getTarget(event);
    EventUtil.preventDefault(event);
    EventUtil.stopPropagation(event);
}