事件 P346页

事件流：从页面接收事件的顺序

1、事件冒泡：IE的事件流，即事件开始时由最具体的元素（文档中嵌套层次最深的那个节点）接收，然后逐级向上传播到较为不具体的节点（文档）。

2、事件捕获：Netscape Communicator团队提出的另一种事件流。与事件冒泡方向相反。

3、DOM事件流

‘DOM2级事件’规定的事件流包括三个阶段：事件捕获阶段、处于目标阶段、事件冒泡阶段。

事件处理程序

事件处理程序的名字以‘on’开头

1、HTML事件处理程序   含‘on’

2、DOM0级事件处理程序      含‘on’

3、DOM2级事件处理程序：addEventListener()、removeEventListener()   

接受三个参数：要处理的事件名、作为事件处理程序的函数、一个布尔值

其中布尔值参数为true，表示在捕获阶段调用事件处理程序；若为false，表示冒泡阶段调用事件处理程序。

4、IE事件处理程序：attachEvent()、detachEvent()

接受两个参数：事件处理程序名称、事件处理程序函数     含‘on’

attachEvent()方法和addEventListener()方法类似，可以为一个元素添加多个事件处理程序。但是触发事件的顺序相反

5、跨浏览器的事件处理程序***   addHandler()      removeHandler() 。。。。  详见P354页、P361页、P373页、P374页、

EventUtil的用法如下：

var EventUtil={
    addHandler:function (element,type,handler) {
         if(element.addEventListener){
             element.addEventListener(type,handler,false)
         }else if(div.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(div.detachEvent){
            element.detachEvent('on'+type,handler)
        }else {
            element['on'+type]=null;
        }
    },
    getEvent:function (event) {
        return event?event:event.srcElement;
    },
    getTarget:function (event) {
        return event.target||event.srcElement;
    },
    getRelatedTarget:function (event) {
        if(event.relatedTarget){
            return event.relatedTarget;
        }else if(event.toElement){
            return event.toElement;
        }else if(event.fromElement){
            return event.fromElement;
        }else {
            return null;
        }
    },
    getButton:function (event) {
        if(document.implementation.hasFeature('MouseEvent','2.0')){
            return event.button;
        }else {
            switch (event.button){
                case 0:
                case 1:
                case 3:
                case 5:
                case 7:
                    return 0;
                case 2:
                case 6:
                    return 2;
                case 4:
                    return 1;
            }
        }
    }
};

事件对象

1、DOM中的事件对象  详见P355页。

2、IE中的事件对象      详见P359页。

3、跨浏览器的事件对象     详见P361页。getEvent   getTarget      preventDefault