【JavaScript】JavaScript常见位置属性总结

（一）网页部分document/window：

网页可见区域宽： document.body.clientWidth;
网页可见区域高： document.body.clientHeight;
网页可见区域宽：document.body.offsetWidth   (包括边线的宽);
网页可见区域高：document.body.offsetHeight  (包括边线的宽);
网页正文全文宽：document.body.scrollWidth;
网页正文全文高：document.body.scrollHeight;
网页被卷去的高：document.body.scrollTop;
网页被卷去的左：document.body.scrollLeft;
网页正文部分上： window.screenTop;
网页正文部分左： window.screenLeft;
屏幕分辨率的高： window.screen.height;
屏幕分辨率的宽： window.screen.width;
屏幕可用工作区高度： window.screen.availHeight;
屏幕可用工作区宽度：window.screen.availWidth;

（二）对象部分body/div：

1、offsetWidth width+padding+border)当前对象的宽度。

2、offsetHeight:(Height+padding+border)当前对象的高度。

3、offsetLeft :当前对象到其上级层左边的距离。

4、offsetTop :当前对象到其上级层顶部边的距离。

5、scrollWidth:获取对象的滚动宽度 。

6、scrollHeight: 获取对象的滚动高度。

7、scrollLeft:设置或获取位于对象左边界和对象中目前可见内容的最左端之间的距离(width+padding为一体)

8、scrollTop:设置或获取位于对象最顶端和对象中可见内容的最顶端之间的距离；(height+padding为一体)

9、clientWidth: 获取对象可见内容的宽度，不包括滚动条，不包括边框；

10、clientHeight: 获取对象可见内容的高度，不包括滚动条，不包括边框；

11、clientLeft: 获取对象的border宽度

12、clientTop：获取对象的border高度

13、offsetParent :当前对象的上级层对象.

（三）总结：

1.宽、高：

Client可见区域、offset可见区域+边框、scorll全文（包括网页被卷去的地方）+边框

2.左、右、上

Offset设置与上级的位置关系

Client设置边框

Scroll设置对象最顶端和对象中可见内容的最顶端之间的距离