定位

不能确定浏览器窗口本身的大小，可以取得页面视口的大小

var pageWidth = window.innerWidth;
         var pageHeight = window.innerHeight;
         if(typeof pageWidth != 'number'){
             if(document.compatMode == 'CSS1Compat'){
                 pageWidth = document.documentElement.clientWidth;
                 pageHeight = document.documentElement.clientHeight;
             }else{
                 pageWidth = document.body.clientWidth;
                 pageHeight = document.body.clientHeight;
             }
         }

offsetHeight    content+padding+border+margin

offsetWidth

offsetLeft与offsetTop和包含元素有关，包含元素的引用保存在offsetParent属性中，offsetParent属性不一定与parentNode的值相等

取得元素的左偏移量

function getElementLeft(ele){
            var actualLeft  = ele.offsetLeft;
            var current = ele.offsetParent;
            while(current !== null){
                acutalLeft += current.offsetLeft;
                current = current.offsetParent;
            }
            return actualLeft;
        }

clientWidth    content + padding+border  客户区的大小，不包括滚动条

clientHeight

滚动大小

scrollHeight   在没有滚动条的情况下，元素的总高度

scrollWidth

scrollLeft 被隐藏在内容区域左侧的像素数，通过设置这一属性可以改变元素的滚动位置

scrollTop

在确定文档的总高度时，要取得clientHieght和scrollheight中的最大值

var docHeight = Math.max(document.documentElement.scrollHeight,document.documentElement.clientHeight);
        var docWidth = Math.max(document.documentElement.scrollWidth,document.documentElement.clientWidth);

getBoundingClientRect()方法获得举行对象

事件对象的定位

1客户区坐标位置（滚动情况下不考虑）

clientX

clientY

表示事件发生时鼠标指针在视口中的水平和垂直坐标，不包括页面滚动的距离

2页面坐标位置（考虑滚动的情况下，页面的位置）

pageX

pageY

表示事件发生时鼠标在页面中的位置，包括滚动的距离；没有滚动的情况下 pageX = clientX

在滚动的情况下 event.pageX =event.clientX + (document.body.scrollLeft || document.documentElement.scrollLeft);

3屏幕坐标位置(就是页面缩小的情况下，事件相对于屏幕的位置)

screenX

screenY