詳解JavaScript編程中的window與window.screen對象

更新時間：2015年10月26日 16:49:03 投稿：goldensun

這篇文章主要介紹了JavaScript編程中的window與window.screen對象,是JS在瀏覽器中視圖編程的基礎(chǔ),需要的朋友可以參考下

Window 對象
所有瀏覽器都支持 window 對象。它表示瀏覽器窗口。
所有 JavaScript 全局對象、函數(shù)以及變量均自動成為 window 對象的成員。
全局變量是 window 對象的屬性。
全局函數(shù)是 window 對象的方法。
甚至 HTML DOM 的 document 也是 window 對象的屬性之一：

window.document.getElementById("header");

與此相同：

document.getElementById("header");

Window 尺寸
有三種方法能夠確定瀏覽器窗口的尺寸（瀏覽器的視口，不包括工具欄和滾動條）。
對于Internet Explorer、Chrome、Firefox、Opera 以及 Safari：

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

對于 Internet Explorer 8、7、6、5：

document.documentElement.clientHeight
document.documentElement.clientWidth

或者

document.body.clientHeight
document.body.clientWidth

實用的 JavaScript 方案（涵蓋所有瀏覽器）：

實例

var w=window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;

var h=window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight;

該例顯示瀏覽器窗口的高度和寬度：（不包括工具欄/滾動條）

Window Screen
window.screen對象在編寫時可以不使用 window 這個前綴。
一些屬性：

screen.availWidth - 可用的屏幕寬度
screen.availHeight - 可用的屏幕高度
Window Screen 可用寬度
screen.availWidth 屬性返回訪問者屏幕的寬度，以像素計，減去界面特性，比如窗口任務(wù)欄。

實例

返回您的屏幕的可用寬度：

<script>

document.write("Available Width: " + screen.availWidth);

</script>

以上代碼輸出為：

Available Width: 1440

Window Screen 可用高度
screen.availHeight 屬性返回訪問者屏幕的高度，以像素計，減去界面特性，比如窗口任務(wù)欄。
實例
返回您的屏幕的可用高度：

<script>

document.write("Available Height: " + screen.availHeight);

</script>

以上代碼將輸出：

Available Height: 860

您可能感興趣的文章:

JavaScript編程中window的location與history對象詳解

相關(guān)文章

Python3實現(xiàn)爬取簡書首頁文章標題和文章鏈接的方法【測試可用】
這篇文章主要介紹了Python3實現(xiàn)爬取簡書首頁文章標題和文章鏈接的方法,結(jié)合實例形式分析了Python3基于urllib及bs4庫針對簡書網(wǎng)進行文章抓取相關(guān)操作技巧,需要的朋友可以參考下
2018-12-12
python 模擬在天空中放風箏的示例代碼
這篇文章主要介紹了python 模擬放風箏的示例代碼，幫助大家更好的利用python處理圖像，感興趣的朋友可以了解下
2021-04-04
對python中兩種列表元素去重函數(shù)性能的比較方法
今天小編就為大家分享一篇對python中兩種列表元素去重函數(shù)性能的比較方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
2018-06-06
對python中Librosa的mfcc步驟詳解
今天小編就為大家分享一篇對python中Librosa的mfcc步驟詳解，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
2019-01-01
Python串口通信的接收與發(fā)送的實現(xiàn)
串口通信是指通過串口進行數(shù)據(jù)傳輸?shù)囊环N通信方式,本文就來介紹一下Python串口通信的接收與發(fā)送的實現(xiàn),具有一定的參考價值,感興趣的可以了解一下
2023-11-11
centos 安裝Python3 及對應(yīng)的pip教程詳解
這篇文章主要介紹了centos 安裝Python3 及對應(yīng)的pip的教程，本文給大家介紹的非常詳細，具有一定的參考借鑒價值,需要的朋友可以參考下
2019-06-06
python獲取word文檔總頁數(shù)的兩種方法
這篇文章主要介紹了python獲取word文檔的總頁數(shù)的兩種方法,文中給出了兩種解決方案,兩種方案也都各有優(yōu)缺點,可能也不一定是完全準確的,需要的朋友可以參考下
2024-03-03
Python讀取英文文件并記錄每個單詞出現(xiàn)次數(shù)后降序輸出示例
這篇文章主要介紹了Python讀取英文文件并記錄每個單詞出現(xiàn)次數(shù)后降序輸出,涉及Python文件讀取、字符串替換、分割以及字典遍歷、排序等相關(guān)操作技巧,需要的朋友可以參考下
2018-06-06
Python 調(diào)用 zabbix api的方法示例
這篇文章主要介紹了Python 調(diào)用 zabbix api的方法示例，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2019-01-01
詳解Python函數(shù)式編程—高階函數(shù)
這篇文章主要介紹了Python函數(shù)式編程—高階函數(shù)，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧
2019-03-03