事件

绑定事件的方法

1.ele.onxxx = function (event) {}
    兼容性很好，但是一个元素只能绑定一个处理程序 基本等同于写在HTML行间上

2.ele.addEventListener(type, fn, false);
    IE9以下不兼容，可以为一个事件绑定多个处理程序
    当第三个参数设置为true就在捕获过程中执行，反之就在冒泡过程中执行处理函数。

3.ele.attachEvent(‘on’ + type, fn);
    IE独有，一个事件同样可以绑定多个处理程序
 

封装兼容性的 addEvent(elem, type, handle) 方法

function addEventListener(element, type, fn) {

        if (element.addEventListener) {

            element.addEventListener(type, fn, false);

       } else if (element.attachEvent) {

            element.attachEvent('on' + type, fn);

        } else {

            element['on' + type] = fn;

        }

    }

解绑事件

1. 使用on事件

绑定事件： 对象. onclick=function(){}

 解绑事件： 对象.onclick=null;

2. 使用addEventListener方法

绑定事件： 对象.addEventListener('不加on的事件类型',函数名,false);

解绑事件： 对象.removeEventListener('不加on的事件类型',对应函数名,false)

3. 使用attachEvent方法

绑定事件： 对象.attachEvent('加on的事件类型',函数名);

解绑事件： 对象.detachEvent('加on的事件类型',对应函数名)；

4. 解绑对应的事件，事件处理函数要写命名函数，这样才能找到对应的进行解绑

事件冒泡

事件冒泡允许多个操作被集中处理（把事件处理器添加到一个父级元素上，避免把事件处理器添加到多个子级元素上），它还可

以让你在对象层的不同级别捕获事件。

阻止事件冒泡

 

 event.stopPropagation(); // 谷歌，火狐支持， 是火狐特有的阻止事件冒泡的方法，ie不支持

window.event.cancelBubble = true;//谷歌，火狐，ie都支持， ie特有的