封装兼容事件绑定和移除函数

211 阅读1分钟

事件的三大组成部分

事件源、事件类型、事件处理程序

封装兼容事件绑定函数

function bindEvent(ele,type,fn){
    try{
        ele.addEventListener(type,fn)
    }catch(error){
        ele.attachEvent('on'+type,fn)
    }
   }  

封装兼容事件移除函数

function reEvent(ele,type,fn){
    try{
        ele.removeEventListener(type,fn)
    }catch(error){
        ele.detachEvent('on'+type,fn)
    }
}

调用

function f1(){console.log('f1');}
function f2(){console.log('f2');}
bindEvent(div,'click',f1);//给事件源div添加一个点击事件,事件处理程序 是控制台输出"f1"
bindEvent(div,'click',f2);//给事件源div再添加一个点击事件,事件处理程序 是控制台输出"f2"
reEvent(div,'click',f2)//移除第二个添加的事件,只会输出'f1'