快捷導(dǎo)航

Javascript獲取窗口(容器)的大小及位置參數(shù)列舉及簡(jiǎn)要說(shuō)明

更新時(shí)間：2012年12月09日 17:27:54 作者：

Javascript獲取窗口（容器）的大小及位置一系列的東西比較多，容易混淆，在這里列舉及簡(jiǎn)要說(shuō)明下,需要的朋友可以參考下

Javascript獲取窗口（容器）的大小及位置一系列的東西比較多，容易混淆，在這里列舉及簡(jiǎn)要說(shuō)明下：

屬性方法說(shuō)明：
clientX 相對(duì)文檔的水平坐標(biāo);
clientY 相對(duì)文檔的垂直坐標(biāo);
offsetX 相對(duì)容器的水平坐標(biāo);
offsetY 相對(duì)容器的垂直坐標(biāo);
scrollWidth 獲取對(duì)象的滾動(dòng)寬度;
scrollHeight 獲取對(duì)象的滾動(dòng)高度;
scrollLeft 設(shè)置或獲取位于對(duì)象左邊界和窗口中目前可見(jiàn)內(nèi)容的最左端之間的距離 ;
scrollTop 設(shè)置或獲取位于對(duì)象最頂端和窗口中可見(jiàn)內(nèi)容的最頂端之間的距離 ;
offsetWidth 獲取對(duì)象相對(duì)于版面或由父坐標(biāo) offsetParent 屬性指定的父坐標(biāo)的寬度;
offsetHeight 獲取對(duì)象相對(duì)于版面或由父坐標(biāo) offsetParent 屬性指定的父坐標(biāo)的高度;
offsetLeft 獲取對(duì)象相對(duì)于版面或由 offsetParent 屬性指定的父坐標(biāo)的計(jì)算左側(cè)位置 ;
offsetTop 獲取對(duì)象相對(duì)于版面或由 offsetTop 屬性指定的父坐標(biāo)的計(jì)算頂端位置.

Javascript獲取屏幕、窗口大小方法：
屏幕分辨率的高：window.screen.height ;
屏幕分辨率的寬：window.screen.width ;
屏幕可用工作區(qū)高度（不包含任務(wù)欄）：window.screen.availHeight ;
屏幕可用工作區(qū)寬度（不包含任務(wù)欄）：window.screen.availWidth;
網(wǎng)頁(yè)可見(jiàn)區(qū)域?qū)挘ú话瑵L動(dòng)條和邊框）：document.body.clientWidth ;
網(wǎng)頁(yè)可見(jiàn)區(qū)域高（不包含滾動(dòng)條和邊框）：document.body.clientHeight;
網(wǎng)頁(yè)可見(jiàn)區(qū)域?qū)挘ò瑵L動(dòng)條和邊框）：document.body.offsetWidth ;
網(wǎng)頁(yè)可見(jiàn)區(qū)域高（包含滾動(dòng)條和邊框）：document.body.offsetHeight ;
網(wǎng)頁(yè)正文寬：document.body.scrollWidth ;
網(wǎng)頁(yè)正文高：document.body.scrollHeight ;
網(wǎng)頁(yè)被卷去的高：document.body.scrollTop ;
網(wǎng)頁(yè)被卷去的左：document.body.scrollLeft ;
網(wǎng)頁(yè)正文部分上（網(wǎng)頁(yè)正文最左邊距離屏幕左邊緣的距離）：window.screenTop ;
網(wǎng)頁(yè)正文部分左（網(wǎng)頁(yè)正文最上邊距離屏幕上邊緣的距離）：window.screenLeft .

注：有時(shí)會(huì)出現(xiàn)取不到值的情況，是因?yàn)閔tml文件頭部加了文檔類(lèi)型：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"> ，
此時(shí)把document.body.scrollTop和document.body.scrollLeft改為：document.documentElement.scrollTop 和document.documentElement.scrollLeft即可，document.body.clientWidth和document.body.clientHeight也要改為：document.documentElement.clientWidth和document.documentElement.clientHeight

當(dāng)然還有疏漏或沒(méi)說(shuō)明清楚的地方，大家可以補(bǔ)充、討論或者百度百度，一起進(jìn)步！ye~

您可能感興趣的文章: