罗列JavaScript常见兼容写法

1. 获取当前网页的宽度和高度

window.innerWidth?window.innerWidth:document.documentElement.clientWidth;
window.innerHeight?window.innerHeight:document.documentElement.clientHeight;

2. 获取滚动条距顶端的距离

var scrollTop=document.documentElement.scrollTop||document.body.scrollTop;

3. 获取滚动条距左边的距离

var scrollTop=document.documentElement.scrollLeft||document.body.scrollLeft;

4. 获取节点对象的class属性的兼容

function getAttributeFromClass(obj,className){
return obj.getAttribute(‘class’)==null?obj.getAttribute(‘className’):obj.getAttribute(‘class’);
}

5. 获取非行内样式的兼容

function getStyle(obj,attr){ //获取非行间样式，obj是对象，attr是值
if(obj.currentStyle){ //针对ie获取非行间样式
return obj.currentStyle[attr];
}else{
return getComputedStyle(obj)[attr]; //针对非ie
};
};

6. 获取事件对象的编码值

oBox.οnclick=function(evt){
var e=evt||window.event;
}

7. 获取鼠标按键的编码值

function getButton(evt){var e=evt||window.event;
if(evt){return e.button;}
else if(window.event){ switch(e.button){
case 1:return 0;
case 4:return 1;
case 2:return 2;}
}
}

8. 获取键盘按键的编码值

//onkeydown和onkeyup事件
var code=event.keyCode||event.which;
//onkeypress事件
var code=event.keyCode||event.which||charCode

9.获取事件源

var target=e.target||e.srcElement;

10.阻止事件冒泡

var e=eve||window.event;
e.stopPropagation?e.stopPropagation():e.cancelBubble=true;

11.阻止浏览器默认行为的兼容（表单提交、超链接、右键菜单）

function stopDefault(eve){
var e=eve||window.event;
e.preventDefault?e.preventDefault():e.returnValue=false;
}

12.事件监听

function addEventListener(obj,event,fn,boo){
if( addEventListener){
obj.addEventListener(event,fn,boo)
}else if(attachEvent){
obj.attachEvent(‘on’+event,fn);
}else{
obj[‘on’+event]=fn;
}
}

13.移除事件监听

function removeEventListener(obj,event,fn,boo){
if( removeEventListener){
obj.removeEventListener(event,fn,boo)
}else if(detachEvent){
obj.detachEvent(‘on’+event,fn);
}else{
obj[‘on’+event]=null;//这里注意,在移除时直接设置为空就好了
}
}