JS中注册事件与移除事件的三种方式及兼容性处理

1. 第一种(所有浏览器都支持，但是无法给同一个对象的同一个事件注册多个事件处理函数)

//注册事件
 btn.onclick = function() {
            alert("111");
   		}
 btn.onclick = function() {
            alert("222");
		}
//移除事件
 btn.onclick = function() {
            alert("222");
            btn.onclick=null;
		}

2. 第二种(dom标准中的方法，存在浏览器兼容性问题，IE9以后支持)

//注册事件
 btn.addEventListener("click", function() {
            alert("111");
        }，false)//第三个参数默认为false,事件冒泡。如果是true则是事件捕获
 btn.addEventListener("click", function() {
            alert("222");
        })
//移除事件
//该方法移除事件不能使用匿名函数
function btnClick(){
	alert("222");
	//移除事件
	btn.removeEventListener('click', btnClick);
}
//添加事件
btn.addEventListener("click",btnClick);

3. 第三种(第一个参数，事件的名称前要加 on。存在浏览器兼容性问题，IE的老版本特有的方法，IE6-10支持)

 btn.attachEvent('onclick', function () {
      alert('111');
    });

 btn.attachEvent('onclick', function () {
      alert('222');
    });
//移除事件
//该方法移除事件不能使用匿名函数
function btnClick(){
	alert("222");
	//移除事件
	btn.detachEvent('onclick', btnClick);
}
//添加事件
btn.attachEvent("onclick",btnClick);

注册事件的兼容性处理

//eventName,不带on(如：click,mouseover)
        function addEventListener(element, eventName, fn) {
            //判断当前浏览器是否支持addEventListener方法
            if (element.addEventListener) {
                element.addEventListener(eventName, fn);
            } else if (element.attachEvent) {
                element.attachEvent(eventName, fn);
            } else {
                element["on" + eventName] = fn; //相当于element.onclick=fn;
            }
        }

移除事件的兼容性处理

//eventName,不带on(如：click,mouseover)
        function removeEventListener(element, eventName, fn) {
            //判断当前浏览器是否支持addEventListener方法
            if (element.removeEventListener) {
                element.removeEventListener(eventName, fn);
            } else if (element.detachEvent) {
                element.detachEvent("on"+eventName, fn);
            } else {
                element["on" + eventName] = null; //相当于element.onclick=fn;
            }
        }

PS: Hei，说的就是你啦，此刻看完是否对你有帮助呢？如果有的话，也不要吝啬你们的赞哟，就算是对新人我的一丢丢鼓励捏~，❥(^_-)