JavaScript兼容问题

网页可见区域宽高 //宽 document.body.clientWidth||document.documentElement.clientWidth; //高 document.body.clientHeigh||document.documentElement.clientHeight;

注：client不包括边框 offset包括边框 2.整个页面宽高

//宽 document.body.scrollWidth||document.documentElement.scrollWidth; //高 document.body.scrollHeight||document.documentElement.scrollHeight;

3.页面卷动

document.body.scrollTop||document.documentElement.scrollTop;

4.evet事件 这里用点击事件来说明，代码是兼容写法

documnet.onclick = function(e){ var e = e || window.event; var mouseX = e.clientX; var mouseY = e.clientY; }

注：e支持谷歌、火狐、IE9及以上版本；event支持谷歌、IE，不支持火狐 5.获取非行间样式值 （1）currentStyle => 支持IE浏览器 （2）computedStyle => 非IE浏览器能识别 可以用函数封装起来，使用的时候调用就可以了 写法：一般在函数内做判断

function getStyle(object,css){ if(object.currentStyle){ return object.currentStyle[css]; } else { return getComputedStyle(object.null)[css]; } }

6.监听事件 （1）添加事件监听 1）非IE => addEventListener(); 2）IE => attachEvent(); （2）删除事件监听 1）非IE => removeEventListener(); 2）IE => detachEvent(); 7.阻止冒泡事件 以点击为例

document.onclick = function(e){ var e = e || window.event; if(e.stopPropagation){ e.stopPropagation(); //W3C标准 } else { e.cancelBubble = true; //支持IE浏览器 } }

8.阻止默认事件 以点击事件为例

document.onclick = function(e){ var e = e || window.event; if(e.preventDefault){ e.preventDefault(); //W3C标准 } else { e.returnValue = "false"; //支持IE浏览器 } }