js中常用取得視窗尺寸的屬性有哪些

window.innerHeight（innerWidth）：表示可見區域的高度（寬度），如果底部（右側）有滾動條，會把底部（右側）滾動條的高度（寬度）計算進去，此方法適用於標準瀏覽器及IE9+。

document.documentElement.clientHeight（clientWidth）：表示可見區域的高度（寬度），不會把捲軸的高度寬度計算進去，此方法適用於標準瀏覽器及低版本IE標準模式。

document.documentElement.offsetHeight（offsetWidth）：首先offsetWidth獲得的值與clientWidth一樣，而offsetHeight獲得的是整個文件的高度。

注意：
個人認為上面的documentElement不代表body。當一個element有border時，element.offsetHeight包含border的值，而element.clientHeight不包含border的寬度。

document.documentElement.scrollHeight（scrollWidth）：取得網頁文字全文高和寬，包含邊線寬度。

document.body.clientHeight（clientWidth）：首先clientWidth得到的值等於document.documentElement.offsetWidth剪下body邊線寬度，而clientHeight獲得的是整個body的高度減去邊線寬度。

document.body.offsetHeight（offsetWidth）：獲得的值等於document.body.clientHeight（clientWidth）加上body的邊線（border）寬度，即這兩個值取到到的包含邊線寬度。

document.body.scrollHeight（scrollWidth）：取得網頁文字全文高和寬，包含邊線寬度。

document.body.scrollTop（scrollLeft）：瀏覽器視窗頂部與文件頂部之間的距離（瀏覽器視窗與文件左側之間的距離），也就是捲軸滾動的距離。

window.pageYOffset（pageXOffset）：瀏覽器視窗頂部與文件頂部之間的距離（瀏覽器視窗與文件左側之間的距離），也就是滾動條捲動的距離。

window.screen.height（width）：螢幕解析度的高（寬）。

window.screen.availHeight（availWidth）：螢幕可用工作區高（寬）。

下面我們來解釋一下offsetTop、clientTop、scrollTop分別代表什麼：

offsetTop:距離上方或上層控制項的位置，整數，單位像素。

clientTop:元素的內容區距離元素邊緣的距離，即元素的邊線寬度。

scrollTop:元素視窗頂部與元素頂部之間的距離，即元素內部捲軸滾動的距離。

以上是js中常用取得視窗尺寸的屬性有哪些的詳細內容。更多資訊請關注PHP中文網其他相關文章！