JavaScript Window瀏覽器對象模型原理解析
瀏覽器對象模型 (BOM) 使 JavaScript 有能力與瀏覽器"對話"。
瀏覽器對象模型 (BOM)
瀏覽器對象模型(Browser Object Model (BOM))尚無正式標(biāo)準(zhǔn)。
由于現(xiàn)代瀏覽器已經(jīng)(幾乎)實現(xiàn)了 JavaScript 交互性方面的相同方法和屬性,因此常被認(rèn)為是 BOM 的方法和屬性。
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 方法
一些其他方法:
- window.open() - 打開新窗口
- window.close() - 關(guān)閉當(dāng)前窗口
- window.moveTo() - 移動當(dāng)前窗口
- window.resizeTo() - 調(diào)整當(dāng)前窗口的尺寸
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
JS中如何實現(xiàn)點擊a標(biāo)簽返回頁面頂部的問題
這篇文章主要介紹了JS中實現(xiàn)點擊a標(biāo)簽返回頁面頂部的問題,非常不錯,具有參考借鑒價值,需要的的朋友參考下吧2017-01-01js模擬如何實現(xiàn)重載以及默認(rèn)參數(shù)
這篇文章主要介紹了js模擬如何實現(xiàn)重載以及默認(rèn)參數(shù),具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2022-05-05JavaScript實現(xiàn)多維數(shù)組的方法
這篇文章主要介紹了JavaScript實現(xiàn)多維數(shù)組的方法,有需要的朋友可以參考一下2013-11-11微信小程序使用checkbox顯示多項選擇框功能【附源碼下載】
這篇文章主要介紹了微信小程序使用checkbox顯示多項選擇框功能,涉及相關(guān)事件綁定與元素遍歷操作技巧,并附帶源碼供讀者下載參考,需要的朋友可以參考下2017-12-12Js中使用hasOwnProperty方法檢索ajax響應(yīng)對象的例子
這篇文章主要介紹了Js中使用hasOwnProperty方法檢索ajax響應(yīng)對象的例子,本文介紹的技巧就是hasOwnProperty方法在ajax請求中的使用,需要的朋友可以參考下2014-12-12javaScript canvas實現(xiàn)(畫筆大小 顏色 橡皮的實例)
下面小編就為大家分享一篇javaScript canvas實現(xiàn)(畫筆大小 顏色 橡皮的實例),具有很好的參考價值,希望對大家有所幫助2017-11-11