封装的一些原生js兼容性的写法

获取滚动条的滚动距离

 function getScrollOffset(){
    if(window.pageXOffset){
        return {
            x:window.pageXOffset,
            y:window.pageYOffset
        }
    }else{
        return {
            x:document.body.scrollLeft + document.documentElement.scrollLeft,
            y:document.body.scrollTop + document.documentElement.scrollTop
        }
    }
}

获取浏览器视口尺寸

function getViewportOffset(){
    if(window.innerWidth){
        return {
            w : window.innerWidth,
            h : window.innerHeight
        }
    }else{
        if(document.compatMode === "BackCompat"){//怪异盒模型
            return {
                w : document.body.clientWidth,
                h : document.body.clientHeight
            }
        }else{
            return {
                w : document.documentElement.clientWidth,
                h : document.documentElement.clientHeight
            }
        }
    }
}

获取样式的方法

function getStyle(elem,prop){
    if(window.getComputedStyle){
        return window.getComputedStyle(elem,null)[prop];
    }else{
        return elem.currentStyle[prop];
    }
}

监听事件的兼容写法

function addEvent(elem,type,handle){
    if(elem.addEventListener){
        elem.addEventListener(type,handle,false)
    }else if(elem.attachEvent){
        //兼容ie
        elem.attachEvent('on'+type,function(){
            handle.call(elem)
        })
    }else{
        elem['on'+type] = handle;
    }
}

取消事件冒泡

function stopBubble(event){
    if(event.stopPropagetion){
        event.stopPropagetion();
    }else{
        event.cancelBubble = true
    }
}

阻止默认事件

function cancelHandle(event){
    if(event.preventDefault){
        event.preventDefault()
    }else{
        event.returnValue = false;
    }
}

异步加载文件并调用方法

function loadScript(url,callback){
    var script = document.createElement('script')
    script.type = "text/javascript"
    if(script.readyState){
        script.onreadystatechange = function(){//ie
            if(script.readyState == 'complete' || script.readyState == 'loaded'){
                callback();
            }
        }
    }else{
        script.onload = function(){
            callback();
        }
    }
    script.src = url;
    document.head.appendChild(script)
}
//调用方法  loadScript('demo.js,function(){
//     test()
// })