clientHeight, offsetHeight, scrollHeight

Posted by on | |
轉自:http://bluecat.csie.net/2006/12/25/322/
====================================================================================
四種瀏覽器:IE(Internet Explorer)、NS(Netscape)、Opera、FF(FireFox)。

clientHeight:
四種瀏覽器對 clientHeight 都沒有什麼異議,都認為是內容可視區域的高度,
一般是瀏覽器最後一個工具條以下到狀態欄以上的這個區域,與頁面內容無關。

offsetHeight:
IE、Opera 認為 offsetHeight = clientHeight + 滾動條 + 邊框。
NS、FF 認為 offsetHeight 是網頁內容實際高度,可以小於 clientHeight。

scrollHeight:
IE、Opera 認為 scrollHeight 是網頁內容實際高度,可以小於 clientHeight。
NS、FF 認為 scrollHeight 是網頁內容高度,不過最小值是 clientHeight。

簡單地說:
clientHeight 就是透過瀏覽器看內容的這個區域高度。
NS、FF 認為 offsetHeight 和 scrollHeight 都是網頁內容高度,只不過當網頁內容高度小於等於 clientHeight 時,scrollHeight 的值是 clientHeight,而 offsetHeight 可以小於 clientHeight。
IE、Opera 認為 offsetHeight 是可視區域 clientHeight 滾動條加邊框。scrollHeight 則是網頁內容實際高度。

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

但是:
FF 在不同的 DOCTYPE 中對 clientHeight 的解釋不同, xhtml 1 trasitional 中則不是如上解釋的。其它瀏覽器則不存在此問題。
In old day...

0 意見: