Window 對象
所有瀏覽器都支援 window 對象。它表示瀏覽器視窗。
所有 JavaScript 全域對象、函數以及變數均自動成為 window 對象的成員。
全域變數是 window 對象的屬性。
全域函數是 window 對象的方法。
甚至 HTML DOM 的 document 也是 window 對象的屬性之一:
window.document.getElementById("header");
與此相同:
document.getElementById("header");
Window 尺寸
有三種方法能夠確定瀏覽器視窗的尺寸(瀏覽器的視口,不包括工具列和捲軸)。
對於Internet Explorer、Chrome、Firefox、Opera 以及 Safari:
- window.innerHeight - 瀏覽器視窗的內部高度
- window.innerWidth - 瀏覽器視窗的內部寬度
對於 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 屬性返回訪問者螢幕的寬度,以像素計,減去介面特性,比如視窗工作列。
執行個體
返回您的螢幕的可用寬度:
以上代碼輸出為:
Available Width: 1440
Window Screen 可用高度
screen.availHeight 屬性返回訪問者螢幕的高度,以像素計,減去介面特性,比如視窗工作列。
執行個體
返回您的螢幕的可用高度:
以上代碼將輸出:
Available Height: 860