个回答

• nideyida

  2015-10-28 19:13:35

  clientHeight
  

  大部分浏览器对 clientHeight 都没有什么异议，认为是元素可视区域的高度，也就是说元素或窗口中可以看到内容的这个区域的高度，即然是指可看到内容的区域，滚动条不算在内。但要注意padding是算在内。其计算方式为clientHeight = topPadding + bottomPadding+ height - 水平滚动条高度。

  offsetHeight

  在IE6，IE7，IE8， IE9以及最新的的FF, Chrome中，对于一般元素，都是offsetHeight = padding + height + border = clientHeight + 滚动条 + 边框。 
  

  scrollHeight

  
  

  scrollHeight的争议比较大，有些浏览器认为scrollHeight可以小于clientHeight，有些认为scrollHeight至少应该等于clientHeight。但有一点是一样的，就是scrollHeight >= topPadding + bottomPadding + 内容margin box的高度。

  在浏览器中的区别在于：
  

  IE6、IE7 认为scrollHeight 是内容高度，可以小于clientHeight。

  FF 认为scrollHeight 是内容高度，不过最小值是clientHeight。

  注： 以上都是对于一般元素而方言的，body和documentElement的clientHeight, offsetHeight和scrollHeight在各个浏览器中的计算方式又不同。

  在所有的浏览器中，如果你想获取视窗可见部分的高度，应该使用documentElement.clientHeight，因为body.clientHeight是由它的内容决定的。

  
  

  4

• pardon110

  2015-10-21 17:17:17

  我直接上图了

  7