在網(wǎng)上搜了一下,，結(jié)論非常籠統(tǒng),，講IE從不講版本,，因此自己做了測(cè)試并上傳結(jié)論。以下結(jié)論皆是在標(biāo)準(zhǔn)模式下測(cè)試通過的,，沒有測(cè)試quirk模式,。

clientHeight

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

offsetHeight
在IE6,，IE7,，IE8以及最新的的FF, Chrome中,，在元素上都是offsetHeight = clientHeight 滾動(dòng)條 邊框。

scrollHeight
scrollHeight是元素的padding加元素內(nèi)容的高度,。這個(gè)高度與滾動(dòng)條無關(guān),，是內(nèi)容的實(shí)際高度。

計(jì)算方式 ：scrollHeight = topPadding bottomPadding 內(nèi)容margix box的高度,。

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

IE6,、IE7 認(rèn)為scrollHeight 是網(wǎng)頁內(nèi)容實(shí)際高度，可以小于clientHeight,。

FF,、Chrome 認(rèn)為scrollHeight 是網(wǎng)頁內(nèi)容高度，不過最小值是clientHeight,。

注： 以上都是對(duì)于一般元素而方言的,，body和documentElement的clientHeight, offsetHeight和scrollHeight在各個(gè)瀏覽器中的計(jì)算方式又不同。在所有的瀏覽器中,，如果你想獲取整個(gè)視窗的高度,，你得用documentElement.clientHeight，因?yàn)閎ody.clientHeight是由它的內(nèi)容決定的,。 關(guān)于body和documentElement的這些屬性,，則完全是另外一回事：

FF19

在body上設(shè)置overflow:scroll就是設(shè)置瀏覽器的滾動(dòng)條，導(dǎo)致body.clientHeight永遠(yuǎn)都等于body.scrollHeight,。

body
clientHeight：body.padding body.height(css設(shè)置或內(nèi)容撐的);

offsetHeight：clientHeight body.border;

scrollHeight== clientHeight,。

documentElement
clientHeight= window視窗高度 -scrollbar.width。

offsetHeight= body.offsetHeight  body.margin,。

scrollHeight= 內(nèi)容的高度（與body的height樣式無關(guān)）,，但最小值是documentElement.clientHeight。

元素上
offsetHeight= padding border height,。

clientHeight= padding height - scrollbar.width,。

scrollHeight>= clientHeight

從結(jié)果分析，F(xiàn)F認(rèn)為scrollHeight的最小高度是clientHeight,。

offsetLeft = 元素border左上角到window視窗原點(diǎn)的距離 或 到offsetParent的borderbox頂部的距離,。

Chrome
body
clientHeight= body.padding body.height（css設(shè)置或內(nèi)容撐大）；

offsetHeight = body.clientHeight body.border,；

scrollHeight= body.padding 內(nèi)容的高度(與height樣式無關(guān)),，但最小值是documentElement.clientHeight。

documentElement
clientHeight= window視窗高度 – 滾動(dòng)條高度,。

offsetHeight  = body.offsetHeight body.margin;

scrollHeight  = 內(nèi)容的高度（與body上的height無關(guān)）,，但最小值是documentElement.offsetHeight。

元素上
offsetHeight = padding border height,。

clientHeight = padding height - scrollbar.width,。

scrollHeight >= clientHeight

Safari 5
body
clientHeight= body.padding body.height（CSS或內(nèi)容撐的）;

offsetHeight= clientHeight border;

scrollHeight= body.padding 內(nèi)容的高度(與height樣式無關(guān)),，但最小值是documentElement.clientHeight。

documentElement
clientHeight = window窗口大小 – 滾動(dòng)條大小

offsetHeight = body.offsetHeight body.margin

scrollHeight= 內(nèi)容的高度（與body上的height無關(guān)）,，但最小值是documentElement.offsetHeight,。

IE8
在IE8下，滾動(dòng)條的大小是17個(gè)像素,。

body
clientHeight= body.padding body.height(css設(shè)置或內(nèi)容撐大)

offsetHeight = clientHeight body.border

scrollHeight =內(nèi)容的高度（與body上的height無關(guān)）,，但最小值是clientHeight。

documentElement
clientHeight = 窗口大?。ǔL動(dòng)條后）

offsetHeight = clientHeight 滾動(dòng)條大小 body.border

scrollHeight=內(nèi)容的高度（與body上的height無關(guān)）,，但最小值是body.offsetHeight margin。

元素上
offsetHeight = padding border height,。

clientHeight = padding height - scrollbar.width,。

scrollHeight >= clientHeight

從結(jié)果分析，F(xiàn)F認(rèn)為scrollHeight的最小高度是clientHeight,。

offsetLeft = 元素border左上角到畫布原點(diǎn)的距離 或 到offsetParent的borderbox頂部的距離。

IE7
在IE7中,，body上設(shè)置的滾動(dòng)條并不是窗口的滾動(dòng)條,，這個(gè)需要注意。

body
clientHeight= body.padding height(css設(shè)置或內(nèi)容撐大)– body上的滾動(dòng)條,。

offsetHeight= clientHeight 滾動(dòng)條的大小 body.border,。

scrollHeight=   內(nèi)容的高度（與body上的height無關(guān)）。

documentElement
clientHeight = window視窗大?。ㄅc滾動(dòng)條的有無無關(guān)）

offsetHeight = clientHeight,。

scrollHeight = body.offsetHeight border.margin

元素
offsetHeight = padding border height。

clientHeight = padding height - scrollbar.width,。

scrollHeight = padding 內(nèi)容marginbox的高度

從結(jié)果分析,，IE7認(rèn)為scrollHeight可以小于clientHeight。

offsetLeft = 元素border box左上角到父容器（不是offsetParent）的borderbox左上角的距離,。

IE6
在IE6中,，與IE7類似， body上設(shè)置的滾動(dòng)條并不是窗口的滾動(dòng)條,。

body
clientHeight = body.padding body.height

offsetHeight = body.clientHeight body.border body上滾動(dòng)條大小,。

scrollHeight =內(nèi)容的高度（與body上的height無關(guān)）。

documentElement
在IE6中,，與IE7類似,，雖然body上設(shè)置的滾動(dòng)條并不是窗口的滾動(dòng)條，但它的clientHeight和offsetHeight還算與其它瀏覽器想統(tǒng)一,。

clientHeight = 窗口大?。ǔゴ翱跐L動(dòng)條大小后）

offsetHeight =clientHeight body.border

scrollHeight = body.offsetHeight body.margin

元素
offsetHeight = padding border height,。

clientHeight = padding height - scrollbar.width。

scrollHeight = padding 內(nèi)容margin box的高度

從結(jié)果分析,，IE6認(rèn)為scrollHeight可以小于clientHeight,。

同理

clientWidth、offsetWidth 和scrollWidth 的解釋與上面相同,，只是把高度換成寬度即可,。