window.screen.height和window.screen.availHeight和document.body.clientHeight和document.documentElement.clientHeight


說這幾個屬性前 我說一下我的設備

我的設備有兩個,一個高度為1080的顯示器,一個高度為800的電腦

 

第一種:window.screen.height

這個方法是獲取用戶電腦屏幕的高度,是不關瀏覽器或者頂部工具欄跟底部工具欄的高度的

當我在高度為1080的我的顯示屏屏幕上打印

window.screen.height
1080

當我在我的電腦上打印

window.screen.height
800

是的 ,這個屬性就是電腦的高度

第二個屬性:window.screen.availHeight

這個屬性,看字面意思,顧名思義,就是電腦屏幕的可用高度,

那當然就是電腦屏幕減掉頂部工具欄跟底部工具欄的高度

我在顯示器上打印了這個屬性,會得到以下

window.screen.availHeight
1057

1057是等於=1080(電腦屏幕)-23(頂部工具欄)

因為我的顯示器上面沒有底部工具欄

 

好,現在我在我的電腦上打印

window.screen.availHeight
714

是714=800-頂部工具欄(22)-底部工具欄(64)

 

第三個:document.body.clientHeight

這個屬性只跟瀏覽器的高度有關

當時我在顯示器上打印的時候,我打印來

document.body.clientHeight
3367

我一臉懵逼,這怎么會有三千多高度呢

我屏幕一共才1080

后來我才想通,是瀏覽器里面的整個頁面高度,因為我打開一個頁面調試的時候是有滾動條的

第四個:document.documentElement.clientHeight

這個屬性就是只跟瀏覽器有關,是瀏覽器里面的頁面的可用可見高度

就還是我剛才那個顯示器打印

document.documentElement.clientHeight
880

是的 我想說的就是這些了,反正我研究了一下這個之后,對這幾個獲得高度的屬性差不多知道了

 

還有什么的話歡迎各位補充哦

 

 

第五個:window.innerHeight


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM