offsetTop
獲取對(duì)象相對(duì)于版面或由 offsetParent 屬性指定的父坐標(biāo)的計(jì)算頂端位置。
offsetLeft
獲取對(duì)象相對(duì)于版面或由 offsetParent 屬性指定的父坐標(biāo)的計(jì)算左側(cè)位置。
offsetHeight
獲取對(duì)象相對(duì)于版面或由父坐標(biāo) offsetParent 屬性指定的父坐標(biāo)的高度。
IE、Opera 認(rèn)為 offsetHeight = clientHeight + 滾動(dòng)條 + 邊框。
NS、FF 認(rèn)為 offsetHeight 是網(wǎng)頁(yè)內(nèi)容實(shí)際高度,可以小于 clientHeight。
offsetWidth
獲取對(duì)象相對(duì)于版面或由父坐標(biāo) offsetParent 屬性指定的父坐標(biāo)的寬度。
offsetParent
獲取定義對(duì)象 offsetTop 和 offsetLeft 屬性的容器對(duì)象的引用。
clientHeight
獲取對(duì)象的高度,不計(jì)算任何邊距、邊框、滾動(dòng)條或可能應(yīng)用到該對(duì)象的補(bǔ)白。
大家對(duì) clientHeight 都沒(méi)有什么異議,都認(rèn)為是內(nèi)容可視區(qū)域的高度,也就是說(shuō)頁(yè)面瀏覽器中可以看到內(nèi)容的這個(gè)區(qū)域的高度,一般是最后一個(gè)工具條以下到狀態(tài)欄以上的這個(gè)區(qū)域,與頁(yè)面內(nèi)容無(wú)關(guān)。
clientLeft
獲取 offsetLeft 屬性和客戶區(qū)域的實(shí)際左邊之間的距離。
clientTop
獲取 offsetTop 屬性和客戶區(qū)域的實(shí)際頂端之間的距離。
clientWidth
獲取對(duì)象的寬度,不計(jì)算任何邊距、邊框、滾動(dòng)條或可能應(yīng)用到該對(duì)象的補(bǔ)白。
SCROLL屬性
scroll
設(shè)置或獲取滾動(dòng)是否關(guān)閉。
scrollHeight
獲取對(duì)象的滾動(dòng)高度。
scrollLeft
設(shè)置或獲取位于對(duì)象左邊界和窗口中目前可見(jiàn)內(nèi)容的最左端之間的距離。
scrollTop
設(shè)置或獲取位于對(duì)象最頂端和窗口中可見(jiàn)內(nèi)容的最頂端之間的距離。
scrollWidth
獲取對(duì)象的滾動(dòng)寬度。event屬性
x
設(shè)置或獲取鼠標(biāo)指針位置相對(duì)于父文檔的 x 像素坐標(biāo)。
screenX
設(shè)置或獲取獲取鼠標(biāo)指針位置相對(duì)于用戶屏幕的 x 坐標(biāo)
offsetX
設(shè)置或獲取鼠標(biāo)指針位置相對(duì)于觸發(fā)事件的對(duì)象的 x 坐標(biāo)。
clientX
設(shè)置或獲取鼠標(biāo)指針位置相對(duì)于窗口客戶區(qū)域的 x 坐標(biāo),其中客戶區(qū)域不包括窗口自身的控件和滾動(dòng)條
我們這里說(shuō)說(shuō)四種瀏覽器對(duì) document.body 的 clientHeight、offsetHeight 和 scrollHeight 的解釋,這里說(shuō)的是 document.body,如果是 HTML 控件,則又有不同。
這四種瀏覽器分別為IE(Internet Explorer)、NS(Netscape)、Opera、FF(FireFox)。
clientHeight
大家對(duì) clientHeight 都沒(méi)有什么異議,都認(rèn)為是內(nèi)容可視區(qū)域的高度,也就是說(shuō)頁(yè)面瀏覽器中可以看到內(nèi)容的這個(gè)區(qū)域的高度,一般是最后一個(gè)工具條以下到狀態(tài)欄以上的這個(gè)區(qū)域,與頁(yè)面內(nèi)容無(wú)關(guān)。
offsetHeight
IE、Opera 認(rèn)為 offsetHeight = clientHeight + 滾動(dòng)條 + 邊框。 NS、FF 認(rèn)為 offsetHeight 是網(wǎng)頁(yè)內(nèi)容實(shí)際高度,可以小于 clientHeight。
scrollHeight
IE、Opera 認(rèn)為 scrollHeight 是網(wǎng)頁(yè)內(nèi)容實(shí)際高度,可以小于 clientHeight。 NS、FF 認(rèn)為 scrollHeight 是網(wǎng)頁(yè)內(nèi)容高度,不過(guò)最小值是 clientHeight。 簡(jiǎn)單地說(shuō)
clientHeight 就是透過(guò)瀏覽器看內(nèi)容的這個(gè)區(qū)域高度。
NS、FF 認(rèn)為 offsetHeight 和 scrollHeight 都是網(wǎng)頁(yè)內(nèi)容高度,只不過(guò)當(dāng)網(wǎng)頁(yè)內(nèi)容高度小于等于 clientHeight 時(shí),scrollHeight 的值是 clientHeight,而 offsetHeight 可以小于 clientHeight。
IE、Opera 認(rèn)為 offsetHeight 是可視區(qū)域 clientHeight 滾動(dòng)條加邊框。scrollHeight 則是網(wǎng)頁(yè)內(nèi)容實(shí)際高度。
同理
clientWidth、offsetWidth 和 scrollWidth 的解釋與上面相同,只是把高度換成寬度即可。
但是
FF 在不同的 DOCTYPE 中對(duì) clientHeight 的解釋不同, xhtml 1 trasitional 中則不是如上解釋的。其它瀏覽器則不存在此問(wèn)題。
js獲取頁(yè)面高度
在IE中:
document.body.clientWidth ==> BODY對(duì)象寬度
document.body.clientHeight ==> BODY對(duì)象高度
document.documentElement.clientWidth ==> 可見(jiàn)區(qū)域?qū)挾?
document.documentElement.clientHeight ==> 可見(jiàn)區(qū)域高度
在FireFox中:
document.body.clientWidth ==> BODY對(duì)象寬度
document.body.clientHeight ==> BODY對(duì)象高度
document.documentElement.clientWidth ==> 可見(jiàn)區(qū)域?qū)挾?
document.documentElement.clientHeight ==> 可見(jiàn)區(qū)域高度
在Opera中:
document.body.clientWidth ==> 可見(jiàn)區(qū)域?qū)挾?
document.body.clientHeight ==> 可見(jiàn)區(qū)域高度
document.documentElement.clientWidth ==> 頁(yè)面對(duì)象寬度(即BODY對(duì)象寬度加上Margin寬)
document.documentElement.clientHeight ==> 頁(yè)面對(duì)象高度(即BODY對(duì)象高度加上Margin高)
而如果沒(méi)有定義W3C的標(biāo)準(zhǔn),則
IE為:
document.documentElement.clientWidth ==> 0
document.documentElement.clientHeight ==> 0
FireFox為:
document.documentElement.clientWidth ==> 頁(yè)面對(duì)象寬度(即BODY對(duì)象寬度加上Margin寬)document.documentElement.clientHeight ==> 頁(yè)面對(duì)象高度(即BODY對(duì)象高度加上Margin高)
Opera為:
document.documentElement.clientWidth ==> 頁(yè)面對(duì)象寬度(即BODY對(duì)象寬度加上Margin寬)document.documentElement.clientHeight ==> 頁(yè)面對(duì)象高度(即BODY對(duì)象高度加上Margin高)
真是一件麻煩事情,其實(shí)就開(kāi)發(fā)來(lái)看,寧可少一些對(duì)象和方法,不使用最新的標(biāo)準(zhǔn)要方便許多啊。
新聞熱點(diǎn)
疑難解答
圖片精選
網(wǎng)友關(guān)注