Javascript中事件库的封装

在浏览器中，对于事件的操作，兼容性主要是存在DOM2级事件里面，标准浏览器是通过addEventListener()和removeEventListener()来注册事件和绑定事件，在低级版本的IE浏览器里面是有对应的attachEvent()和detachEvent()；再者是里面传入的事件行为，标准的不带on，IE带on；接着是事件处理函数里面的this指向问题：低版本的浏览器指向window，标准浏览器指向绑定的事件对象；事件重复绑定的问题：低版本的浏览器重复绑定会执行多次，标准浏览器重复绑定只执行一次；事件绑定顺序与执行顺序的问题：低版本的浏览器不按照绑定的顺序执行，标准浏览器按照绑定的顺序执行

解决办法的核心

数组

• 创建自己的事件池，放在数组里面
• 把自己的事件池函数绑定在系统上面，当自己的事件池删除事件，相对应的系统也就删除了事件

// 事件绑定的元素，事件类型，事件处理函数
function on(ele,type,fn){
    // 区分浏览器
    if(ele.addEventListener){
         ele.addEventListener(type,fn,false);// 冒泡
     }else{ // IE6-8
         if(!ele['on'+type]){  // 给元素ele身上自定义一个以事件命名的属性
             ele['on'+type]=[];
             //解决run被重复绑定的问题
             ele.attachEvent('on'+type,function(){
                  run.call(ele); // 事件处理函数的作用就是先把run函数里面的this指向ele
              })
           }
       
          // 去重判断，解决重复绑定的问题
          for(var i=0;i