这几个破坐标属性快把人整疯了。。。

Question

有下面几个属性：
我自己将它们分为了以下几组。【style组】left top width height【client组】clientLeft clientTop clientWidth clientHeight【offset组】offsetLeft offsetTop offsetWidth offsetHeight【scroll组】scrollLeft scrollTop scrollWidth scrollHeight大家最常用的是哪一组啊？
在网上查了一些资料，越看越迷糊。
哪一组好用啊？
我自己写的话，基本上都是【style组】的内容，但是有时候需要看别人的代码，
所以还得需要理解其它组到底是什么意思。
大家有没有这方面的小例子可以参考一下啊？
O(∩_∩)O谢谢！！！

Answer 1

个人解释一下，不对的请楼下纠正补充
style:没得说的，设置尺寸位置等
client:通过style设置的尺寸，并不一定是在页面上看到的大小，如果还有padding存在因素的话，client就相当于style加上padding，也就是实际上看到的尺寸
offset:别忘了还有border的存在，它也会影响一个dom在页面上所占的大小，所以加上border
scroll:取决于这个dom的内容，也就是足以使这个dom产生滚动条的最小尺寸以上结论。不记得是在什么文档类型下得出的了哈
我还记得有一种文档类型的boder是在style的范围里面的，以上的border是在style范围外面

Answer 2

难得你还分出组来
怎么用完全看你到底要什么几者之间的关系不是很紧密。可能scroll和client在没有滚动条的时候可以互用。我建议你整理一个笔记出来，然后细细的观察和实践下。

Answer 3

不同浏览器，解析不太一样
网页可见区域宽:
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 
本文来自CSDN博客，转载请标明出处：http://blog.csdn.net/ityuany/archive/2009/11/30/4906961.aspx

Answer 4

还。。还有一个 htmlElement.getBoundingClientRect()  ......