JavaScript獲取瀏覽器可視區(qū)域的寬高

在做項(xiàng)目的時候，我們常常需要對項(xiàng)目做一些優(yōu)化，來提升頁面響應(yīng)的速度，比如進(jìn)入可視區(qū)域后再發(fā)送請求獲取數(shù)據(jù)或者是填充模板，這個時候就需要能夠獲取到瀏覽器的可視區(qū)域的寬高：

// 獲取瀏覽器可視區(qū)域?qū)捀?#xff08;兼容性比較好，不包括工具欄和滾動條） var browserWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth; var browserHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;

對于ie瀏覽器的兼容性一直是令人頭大的問題，ie永遠(yuǎn)是最特殊的那一個瀏覽器，所以你可以使用上面那種兼容性比較好的獲取方法，也可以單獨(dú)設(shè)置ie瀏覽器下獲取可視區(qū)域?qū)捀叩膶傩?#xff1a;

對于 ie 8、7、6、5：

document.documentElement.clientHeight document.documentElement.clientWidth //或者 document.body.clientHeight document.body.clientWidth

對于Internet Explorer9、Chrome、Firefox、Opera 以及 Safari：

window.innerHeight; // 瀏覽器窗口的內(nèi)部高度 window.innerWidth; // 瀏覽器窗口的內(nèi)部寬度

總結(jié)

以上是生活随笔為你收集整理的JavaScript获取浏览器可视区域的宽高的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。