事件处理程序（IE事件流、事件捕获、事件冒泡与事件委托等）

一、IE事件流（IE事件处理程序）
1、添加事件

attachEvent()

语法：element.attachEvent(event,function)
功能：用于向指定元素添加事件句柄；
参数：
event:必须。字符串，指定事件名，必须加“on"前缀。
function:必须。指定事件触发时执行的函数。
2、移除事件

detachEvent()

语法：element.detachEvent(event,function)
功能：移除attachEvent()放法添加的事件句柄
参数：event:必须，字符串，要移除的事件名称。
function：必须。指定要移除的函数。

跨浏览器事件处理程序

    
    
    
    


    点击我
    

二、事件冒泡与事件捕获

1、事件冒泡：先执行儿子，再执行父亲

    
    
    
    


    

    

        
点击儿子
    
    

2、事件捕获：先执行父亲，再执行儿子
//事件捕获
//直系亲属树结构
//html 1
//body 1
//parent 添加了事件 1
//child 添加了事件 1

    document.getElementById("parent").addEventListener("click",function(e){
        alert("parent事件被触发，"+this.id);
    },true);
    document.getElementById("child").addEventListener("click",function(e){
        alert("child事件被触发，"+this.id);
    },true);

大部分情况下我们使用事件冒泡，即最后一个参数为默认值为false。
3、事件委托

    
    
    
    


    

        
item1
        
item2
        
item3
        
item4
        
item5
        
item6
    
    

4、Event对象常用属性与方法

    
    
    
    
    


    点击我
    

        
点击儿子
    
    跳转链接
    


    
    

5、IE8及以下浏览器的Event对象属性与方法

    
    
    
    


    点击我
    跳转链接
    

        
点击儿子
    
    target按钮
    

6、

    
    
    
    


    

        
惦记我
    
    跳转链接
    

事件委托小案例

    
    
    
    
    


    

    

        
红色
        
黑色
        
蓝色
        
黄色
        
黄绿色