offsetHeight和clientHeight的区别
在JavaScript DOM – 元素的offsetHeight和clientHeight之间有什么区别？
clientHeight ：
以像素为单位返回对象可见区域的高度。 该值包含填充的高度，但不包括scrollBar，边框和边距。
offsetHeight ：
以像素为单位返回对象可见区域的高度。 该值包含填充，滚动条和边框的高度，但不包括边距。
所以， offsetHeight包含滚动条和边框， clientHeight不包含。
Oded的答案是理论。 但理论和现实并不总是相同的，至less不是对于在javascript中滚动操作可能很重要的<BODY>或<HTML>元素。
微软在MSDN中有一个很好的形象：
如果您有一个显示垂直滚动条的HTML页面，则可以预期<BODY>或<HTML>元素具有比OffsetHeight更高的ScrollHeight元素，如图所示。 所有旧版本的Internet Explorer都是如此。
但是对于Internet Explorer 11而不是Firefox 36来说，至less在这些浏览器中，OffsetHeight和ScrollHeight差不多。
而OffsetHeight可能是错的，ClientHeight总是正确的。
在不同的浏览器上尝试下面的代码，你会看到：
<!DOCTYPE html> <html> <body> <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br> <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br> <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br> <script> document.write("Body off: " + document.body.offsetHeight + "<br>Body cli: " + document.body.clientHeight + "<br>Html off: " + document.body.parentElement.offsetHeight + "<br>Html cli: " + document.body.parentElement.clientHeight); </script> </body> </html>
虽然较旧的Internet Explorer显示正确：
Body off: 1197 Body cli: 1197 Html off: 878 Html cli: 874
Firefox和Internet Explorer 11的输出是：
Body off: 1260 Body cli: 1260 Html off: 1276 // this is completely wrong Html cli: 889
这清楚地表明偏移高度在这里是错误的。 OffsetHeight和ClientHeight应该只相差几个像素或相同。
请注意，ClientHeight和OffsetHeight对于不可见的元素（例如<FORM>）可能会有很大差异，其中OffsetHeight可能是FORM的实际大小，而ClientHeight可能为零。
