关于浏览器卷曲地三种理解方式

获取浏览器向上卷曲地距离有三种理解方式
1.整个浏览器向上卷曲
window.pageXOffset;
  window.pageYOffset;
2.当前地html页面向上卷曲--documentElement=html
  document.documentElement.scrollLeft;
  document.documentElement.scrollLeft;
3.页面中body中内容向上卷曲
document.body.scrollLeft
  document.body.scrollTop;

第一次兼容：

var top=window.pageYOffset || document.documentElement.scrollTop
    ||document.body.scrollTop ||0;
var left=window.pageXOffset ||document.documentElement.scrollLeft ||
    document.body.scrollLeft ||0;

第二次兼容改进：封装到函数中，放入对象中，对象.属性获取值

function getScrollTopAndLeft() {
    var obj={};
    var top=window.pageYOffset || document.documentElement.scrollTop
        ||document.body.scrollTop ||0;
    var left=window.pageXOffset ||document.documentElement.scrollLeft ||
        document.body.scrollLeft ||0;
    obj.top=top;
    obj.left=left;
    return obj

}

第三次兼容改进:使用键值对地方式（json）

function getScrollTopAndLeft() {
    var obj={
    top:window.pageYOffset || document.documentElement.scrollTop
        ||document.body.scrollTop ||0,
    left:window.pageXOffset ||document.documentElement.scrollLeft ||
        document.body.scrollLeft ||0
  };
    return obj
}

 

最总兼容版本：

function getScrollTopAndLeft() {
    return{
        top:window.pageYOffset || document.documentElement.scrollTop
            ||document.body.scrollTop ||0,
        left:window.pageXOffset ||document.documentElement.scrollLeft ||
            document.body.scrollLeft ||0
    };
}