在编写js的代码时，总会遇到一些兼容问题，下面来总结一些常见的兼容写法：
1.获取样式的兼容写法：
A. 非IE浏览器：getComputedStyle(元素,false).属性名
B. IE浏览器：元素.currenStyle.属性名
C. 兼容的封装写法：正常浏览器和IE8及以下
function getStyle(element, attribute){
if(element.currentStyle){
return element.currentStyle[attribute];
}else{
return getComputedStyle(element, false)[attribute];
}
}
2. 获取事件对象的兼容写法
A. 非IE浏览器：对象.事件 = function(event){} (对象执行函数的参数即是事件对象)
B. IE浏览器：window.event
C.兼容的封装写法：
对象.事件= function(eve){
var e = eve ||window.event;
}
3. 获取事件源的兼容写法：
var target = event.target|| event.srcElement;
解释：event指的是事件对象
4. 获取键盘按键的ASCII码的兼容写法：
var keycode = event.keyCode || event.which;
解释：event指的是事件对象
5. 事件监听绑定事件的兼容写法
A. 非IE浏览器：元素.addEventListener("不加on的事件名",function(){}/句柄,flase/true)
解释：此处的false表式允许事件冒泡，true表式允许事件委托，默认不写为false
B. IE浏览器：元素.attachEvent("加on的事件名",function(){}/事件句柄)
解释：没有第三个参数
C. 事件监听绑定事件兼容的封装写法：
function addEvent(ele, myevent, cb){
if(ele.attachEvent){
ele.attachEvent("on"+myevent, cb);
}else{
ele.addEventListener(myevent, cb, false)
}
}
参数解释：ele指的是元素；myevent指的是事件；cb指的是事件句柄
6. 删除监听事件句柄的兼容写法
A. 非IE浏览器：元素.removeEventListener("不加on的事件名",句柄,false/true);
解释：此处的false表式允许事件冒泡，true表式允许事件委托，默认不写为false
B. IE浏览器：元素.detachEvent("加on的事件名",事件句柄);
解释：没有第三个参数
C. 事件监听绑定事件兼容的封装写法：
function removeEvent(ele,myevent,cb){
if(ele.detachEvent){
ele.detachEvent("on"+myevent,cb);
}else{
ele.removeEventListener(myevent,cb,false);
}
}
参数解释：ele指的是元素；myevent指的是事件；cb指的是事件句柄
7. 事件监听绑定和删除句柄的对象封装写法
var EventUtil={
addHandler:function(DOM, EventType, fn){
if(DOM.addEventListener){
DOM.addEventListener(EventType, fn, false);
}else if(DOM.attachEvent){
DOM.attachEvent('on'+EventType, fn);
}else{
DOM['on'+EventType]=fn; //赋值式
}
},
removeHandler:function(DOM,EventType, fn){
if(DOM.removeEventListener){
DOM.removeEventListener(EventType, fn, false);
}else if(DOM.detachEvent){
DOM.detachEvent('on'+EventType, fn);
}else{
DOM['on'+EventType]=null;
}
}
}
8. 阻止事件冒泡的兼容写法
A. 非IE浏览器：事件对象.stopPropagation();
B. IE浏览器：事件对象.cancelBubble = true;
C. 事件监听绑定事件兼容的封装写法：
function stopBubble(e){
if(e.stopPropagation){
e.stopPropagation();
}else{
e.cancelBubble = true;
}
}
参数解释：e指的是事件对象；
9. 阻止浏览器的默认行为的兼容写法
A. 非IE浏览器：事件对象.preventDefault();
B. IE浏览器：事件对象.returnValue = false;
C. 阻止浏览器默认行为兼容的封装写法：
function stopDefault(e){
if(e.preventDefault){
e.preventDefault();
}else{
e.returnValue = false;
}
}
参数解释：e指的是事件对象。
以上是对js中常见的兼容问题及其解决方法的总结，如有修改、补充，后续会更新。
文中如果纰漏，错误，不合理，描述不清晰，不准确等问题，欢迎大家留言指正...