clientHeight

大部分瀏覽器對(duì) clientHeight 都沒有什么異議，認(rèn)為是元素可視區(qū)域的高度，也就是說元素或窗口中可以看到內(nèi)容的這個(gè)區(qū)域的高度，即然是指可看到內(nèi)容的區(qū)域，滾動(dòng)條不算在內(nèi)。但要注意padding是算在內(nèi)。其計(jì)算方式為clientHeight = topPadding + bottomPadding+ height - 水平滾動(dòng)條高度。

offsetHeight

在IE6，IE7，IE8， IE9以及最新的的FF, Chrome中，對(duì)于一般元素，都是offsetHeight = padding + height + border = clientHeight + 滾動(dòng)條 + 邊框。?

scrollHeight

scrollHeight的爭議比較大，有些瀏覽器認(rèn)為scrollHeight可以小于clientHeight，有些認(rèn)為scrollHeight至少應(yīng)該等于clientHeight。但有一點(diǎn)是一樣的，就是scrollHeight >= topPadding + bottomPadding + 內(nèi)容margin box的高度。

在瀏覽器中的區(qū)別在于：

IE6、IE7 認(rèn)為scrollHeight 是內(nèi)容高度，可以小于clientHeight。

FF 認(rèn)為scrollHeight 是內(nèi)容高度，不過最小值是clientHeight。

注：?以上都是對(duì)于一般元素而方言的，body和documentElement的clientHeight, offsetHeight和scrollHeight在各個(gè)瀏覽器中的計(jì)算方式又不同。

在所有的瀏覽器中，如果你想獲取視窗可見部分的高度，應(yīng)該使用documentElement.clientHeight，因?yàn)閎ody.clientHeight是由它的內(nèi)容決定的。

我直接上圖了