//js原生代码,兼容方案
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
//添加事件 function addEvent(el , eventName , fn) { if(el.attachEvent) { //IE el.attachEvent('on'+eventName,fn); }else if(el.addEventListener) { el.addEventListener(eventName,fn); }else { el['on'+eventName] = fn; } } //注意addEventListener添加相同事件的不同函数,按添加顺序,先添加的先触发,后添加的后触发 //attachEvent在ie8以下(包括ie8),相反顺序触发,后添加的先触发。在ie9以上(包括ie9)顺序与addEventListener相同.例子如下: var testDiv = document.getElementById('testDiv'); testDiv.attachEvent('onclick',func1); testDiv.attachEvent('onclick',func2); testDiv.attachEvent('onclick',func3); function func1() { alert(1); } function func2() { alert(2); } function func3() { alert(3); } ie8以下(包括ie8)输出: 3 2 1 ie9以上(包括ie9)输出: 1 2 3 (addEventListener相同)
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
// 删除事件 function removeEvent(el , eventName , fn) { if(el.detachEvent) { el.detachEvent('on'+eventName,fn); }else if(el.removeEventListener) { el.removeEventListener(eventName,fn); }else { el['on'+eventName] = null; } }
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
//停止冒泡 function stopPropagation(event) { event = event || window.event; if (event.stopPropagation) { event.stopPropagation() } else {// IE event.cancelBubble = true } }
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
//获取元素css属性值 function getStyle(obj, attr) { if (obj.currentStyle) {//IE return obj.currentStyle[attr]; } else { return getComputedStyle(obj, "伪类")[attr];//Firefox } }