dom事件委托(事件冒泡)

事件流：

事件流包含三个阶段：
事件捕捉阶段：事件开始由顶层对象触发，然后逐级向下传播，直到目标元素；

dom->html->body->元素

处于目标阶段：处在绑定事件的元素上；
事件冒泡阶段：事件由具体的元素先接收，然后逐级向上传播，直到不具体的元素；

元素->body->html->dom

注意：

1.js代码只能执行捕获或者冒泡其中一个阶段

2.onclick和attachEvent只能得到冒泡阶段

attachEvent说明:

• attachEvent是IE有的方法，它不遵循W3C标准，而其他的主流浏览器如FF等遵循W3C标准的浏览器都使用addEventListener，所以实际开发中需分开处理。
• 多次绑定后执行的顺序是不一样的，attachEvent是后绑定先执行，addEventListener是先绑定先执行。

obj.attachEvent('onclick',function(){{alert('1');});               obj.attachEvent('onclick',function(){{alert('2');});
obj.attachEvent('onclick',function(){{alert('3');});
//执行顺序是alert(3),alert(2),alert(1);

//兼容处理elm绑定的元素,evType绑定的事件类型，fn事件处理函数,useCapture(使用捕获)事件处理阶段
function addEvent(elm, evType, fn, useCapture) 
{
    if (elm.addEventListener) 
    {
        // W3C标准
        elm.addEventListener(evType, fn, useCapture);
        return true;
    }
    else if (elm.attachEvent) 
    {
        //IE
        var r = elm.attachEvent(‘on‘ + evType, fn);//IE5+
        return r;
    }
    else 
    {
        elm['on' + evType] = fn;//DOM事件
    }
}

3.addeventListener(type,listener[,useCapture])第三个参数是true便是处于捕获阶段调用事件处理，false处于冒泡(默认)

4.实际开发很少用到捕获只关注冒泡

5.事件没有冒泡,onblur,onfocus,onmouseenter,onmouseleave