一、window对象
1.1 窗口左上角在屏幕上的 x 坐标 和 y 坐标（只读）
screenLeft||screenX
screenTop||screenY
兼容性
IE、Safari 和 Opera 支持 ScreenLeft/ScreenTop
Firefox、Safari 支持 ScreenX/ScreenY
Chrome 都支持
1.2 文档区宽高（只读）
文档区宽高（不含工具栏、控制台等，只是网页显示区域的宽高）
innerWidth||document.documentElement.clientWidth||document.body.clientWidth
innerHeight||document.documentElement.clientHeight||document.body.clientHeightinnerWidth是非IE写法，document是IE写法
1.3 整个浏览器窗口的宽高（只读）outerWidth、outerHeight
不支持IE，IE没有获取整个浏览器窗口的宽高的方法
1.4 pageXOffset、pageYOffset
设置或读取当前页面相对于窗口显示区左上角的 X/Y 位置
二、event对象（事件对象）
在触发DOM上的某个事件时，会产生一个事件对象event，这个对象中包含着所有与事件有关的信息。所有浏览器都支持event对象，但支持的方式不同。
普通浏览器支持 event
ie 678 支持 window.event
所以如果需要兼容旧版浏览器的话，可以采取兼容性的写法
var event = event || window.event;2.1 event.screenX event.screenY
返回事件发生时，鼠标指针相对于显示器屏幕的左上角水平／垂直坐标
2.2 event.clientX event.clientY
返回事件发生时，鼠标指针相对于浏览器窗口可视区域的水平／垂直窗口坐标。
可视区域不包括工具栏和滚动条，IE事件和w3c标准事件都定义了这2个属性
2.3 event.offsetX event.offsetY（仅IE）
返回鼠标指针的位置，相对于事件源元素的水平（垂直坐标）
2.4 event.pageX event.pageY（不支持IE）
返回鼠标指针的位置，类似于event.clientX、event.clientY，但它们使用的是文档坐标而非窗口坐标。
三、document对象
3.1 文档区宽高：clientWidth／clientHeight
示例图见1.2小节
document.documentElement.clientWidth || document.body.clientWidth
document.documentElement.clientHeight || document.body.clientHeight3.2 html(body)的总宽高：offsetWidth／offsetHeight
document.documentElement.offsetWidth || document.body.offsetWidth
document.documentElement.offsetHeight || document.body.offsetHeight获取某个元素的总宽高，也可以使用offsetWidth／offsetHeight方法。
3.3 滚动高度（滚动条滚过的长度）
document.documentElement.scrollTop || document.body.scrollTop四、DOM对象（元素）的offset家族
4.1 计算元素宽高：offsetWidth 、 offsetHeight
offsetWidth 计算方法如下：
offsetWidth = width + border + padding
4.2 获取位置 offsetLeft 和 offsetTop
返回距离上级盒子（最近的带有定位）左边的位置。
如果父级都没有定位则以body 为准。
offsetLeft 从父级的padding 开始算 父亲的border 不算，即：就是子盒子到定位的父盒子边框到边框的距离。
4.3 获取带有定位的父级元素 offsetParent
offsetParent返回该对象的父级（带有定位）
4.4 offsetParent 和 parentNode的区别：
如果当前元素的父级元素没有进行CSS定位（position为absolute或relative），offsetParent为body。
如果当前元素的父级元素中有CSS定位（position为absolute或relative），offsetParent取最近的那个父级元素。
4.5 offsetTop 和 style.top 的区别
- 最大区别在于 offsetLeft 可以返回没有定位盒子的距离左侧的位置。 而 style.top 不可以 只有定位的盒子 才有 left top right
- offsetTop 返回的是数字，而 style.top 返回的是字符串，除了数字外还带有单位：px。
- offsetTop 只读，而 style.top 可读写。
- 如果没有给 HTML 元素指定过 top 样式，则 style.top 返回的是空字符串。
- 最重要的区别 style.left 只能得到 行内样式 offsetLeft 随便
4.6 附：获取行内样式的宽高 ele.style.width/height
div.style.width 只能获取到行内样式，无法获取css样式表里面的样式。
五、Window 对象方法
5.1 moveBy( )
语法： window.moveBy(x,y)
相对窗口当前的坐标，把它移动到指定的像素
x：要把窗口右移的像素
y: 要把窗口下移的像素
5.2 moveTo( )
语法： window.moveTo(x,y)
把窗口的左上角移动到一个指定的坐标
x：窗口新位置的 x 坐标
y: 窗口新位置的 y 坐标
提示：出于安全方面的原因，浏览器限制此方法使其不能把窗口移出屏幕。
5.3 resizeBy( )
语法：resizeBy(width, height)
根据指定的像素来调整窗口的大小
width：必需，要使窗口宽度增加的像素数。可以是正、负数值
height：可选，要使窗口高度增加的像素数。可以是正、负数值
5.4 resizeTo( )
语法：resizeTo(width, height)
把窗口的大小调整为指定的宽度和高度
width：必需，想要调整到的窗口的宽度。以像素计
height：可选，想要调整到的窗口的高度。以像素计
5.5 scrollBy( )
语法：scrollBy(xnum, ynum)
把内容滚动指定的像素数
xnum：必需，把文档向右滚动的像素数
ynum：必需，把文档向下滚动的像素数
5.6 scrollTo( )
语法：scrollTo(xpos, ypos)
把内容滚动到指定的坐标
xpos：必需，要在窗口文档显示区左上角显示的文档的 x 坐标
ypos：必需，要在窗口文档显示区左上角显示的文档的 y 坐标