js 常见兼容性处理

1 获取滚动条兼容
var height = document.documentElement.scrollTop||document.body.scrollTop;
2 获取可是区域兼容
var clientWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth || 0; 
var clientHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight || 0; 
3 获取计算后的样式兼容函数
function computedStyle(obj , val) {
            // 检测是否认识window
            if(window.getComputedStyle){
                // 高级浏览器
                // 中括号属性名都可以，人为定义使用短横
                // 如果是borderTopColor 改为border-top-color
                val = val.replace(/([A-Z])/g,function(match, $1) {
                    return  "-" + $1.toLowerCase();
                });
                // 计算后的样式属性
                return window.getComputedStyle(obj)[val];
            }else{
                // IE6,7,8 属性名只能使用驼峰
                // 当用户输入border-width 需要改为borderWidth
                val = val.replace(/-([a-z])/g,function(match, $1){
                    return $1.toUpperCase();
                });
                // 计算后的样式属性
                return obj.currentStyle[val];
            }
        }
4 浏览器事件兼容 
var Event = {
            // 事件绑定兼容
        　　addEvent: function(element,type,callback){
        　　　　if(element.addEventListener){
            // 高级浏览器
        　　　　　　element.addEventListener(type,callback,false);
        　　　　}else if(element.attachEvent){
            // 低版本IE浏览器
        　　　　　　element.attachEvent('on' + type,callback);
        　　　　}
        　　},
        // 事件移除兼容
        　　removeEvent: function(element,type,callback){
            // 高级浏览器
        　　　　if(element.removeEventListener){
        　　　　　　element.removeEventListener(type,callback,false);
        　　　　}else{
            // 低版本IE浏览器
        　　　　　　element.detachEvent('on' + type, callback);
        　　　　}
        　　},
            // 获取事件对象兼容
        　　getEvent: function(event){
        　　　　return event || window.event;
        　　},
            // 获取事件触发对象兼容
        　　getTarget: function(event){
        　　　　return event.target || event.srcElement;
        　　},
            // 阻止事件冒泡兼容
        　　stopPropagation: function(event){
        　　　　if(event.stopPropagation){
        　　　　　　event.stopPropagation();
        　　　　}else{
        　　　　　　event.cancelBubble = true;
        　　　　}
        　　},
            // 阻止默认事件兼容
        　　preventDefault: function(event){
        　　　　if(event.prevenDefault){
        　　　　　　event.preventDefault();
        　　　　}else{
        　　　　　　event.returnValue = false;
        　　　　}
        　　}
        }