JavaScript Window瀏覽器對象模型原理解析

更新時(shí)間：2020年05月30日 14:43:50 作者：頡旺飛

這篇文章主要介紹了JavaScript Window瀏覽器對象模型,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下

瀏覽器對象模型 (BOM) 使 JavaScript 有能力與瀏覽器"對話"。

瀏覽器對象模型 (BOM)

瀏覽器對象模型（Browser Object Model (BOM)）尚無正式標(biāo)準(zhǔn)。

由于現(xiàn)代瀏覽器已經(jīng)（幾乎）實(shí)現(xiàn)了 JavaScript 交互性方面的相同方法和屬性，因此常被認(rèn)為是 BOM 的方法和屬性。

Window 對象

所有瀏覽器都支持 window 對象。它表示瀏覽器窗口。

所有 JavaScript 全局對象、函數(shù)以及變量均自動(dòng)成為 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)部高度(包括滾動(dòng)條)
window.innerWidth - 瀏覽器窗口的內(nèi)部寬度(包括滾動(dòng)條)

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

document.documentElement.clientHeight
document.documentElement.clientWidth

或者

document.body.clientHeight
document.body.clientWidth

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

實(shí)例

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)當(dāng)前窗口
window.resizeTo() - 調(diào)整當(dāng)前窗口的尺寸

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

javascript去除字符串中所有標(biāo)點(diǎn)符號(hào)和提取純文本的正則
這篇文章主要介紹了javascript去除字符串中所有標(biāo)點(diǎn)符號(hào)和提取純文本的正則,需要的朋友可以參考下
2014-06-06
基于Swiper實(shí)現(xiàn)移動(dòng)端頁面圖片輪播效果
這篇文章主要為大家詳細(xì)介紹了基于Swiper實(shí)現(xiàn)移動(dòng)端頁面圖片輪播效果，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2017-12-12
JS中的JSON對象的定義和取值實(shí)現(xiàn)代碼
這篇文章主要介紹了JS中的JSON對象的定義和取值實(shí)現(xiàn)代碼,也是json的入門知識(shí)，需要的朋友可以參考下
2018-05-05
基于JS實(shí)現(xiàn)html中placeholder屬性提示文字效果示例
這篇文章主要介紹了基于JS實(shí)現(xiàn)html中placeholder屬性提示文字效果,涉及javascript事件響應(yīng)及頁面元素屬性動(dòng)態(tài)操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下
2018-04-04
預(yù)加載css或javascript的js代碼
為了提高網(wǎng)站的加載速度，有一個(gè)很重要的手段就是在用戶瀏覽過程中的上游網(wǎng)站做一個(gè)文件的預(yù)加載。
2010-04-04
微信小程序完美解決scroll-view高度自適應(yīng)問題的方法
這篇文章主要介紹了微信小程序完美解決scroll-view高度自適應(yīng)問題的方法，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2020-08-08
手機(jī)端頁面rem寬度自適應(yīng)腳本
網(wǎng)上關(guān)于這方面的文章有很多，重復(fù)的東西本文不再贅述，僅提供思路，并解釋一些其他文章講述模糊的地方。重點(diǎn)給大家介紹下rem.有需要的小伙伴可以參考下。
2015-05-05
js將列表組裝成樹結(jié)構(gòu)的兩種實(shí)現(xiàn)方式分享
最近做的任務(wù)提了新的需求,需要實(shí)現(xiàn)一個(gè)樹形結(jié)構(gòu),所以下面這篇文章主要給大家介紹了關(guān)于js將列表組裝成樹結(jié)構(gòu)的兩種實(shí)現(xiàn)方式,需要的朋友可以參考下
2022-01-01
JavaScript實(shí)現(xiàn)秒殺時(shí)鐘倒計(jì)時(shí)
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)秒殺時(shí)鐘倒計(jì)時(shí)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2019-09-09
用JS得到字符串中出現(xiàn)次數(shù)最多的字母
一個(gè)字符串String=“adadfdfseffserfefsefseetsdg”，找出里面出現(xiàn)次數(shù)最多的字母和出現(xiàn)的次數(shù)。經(jīng)典的解答思路為：取出字符串的第一個(gè)字符（首字母），利用的字符串的 replace 方法將符合正則表達(dá)式（第一個(gè)字符）替代為空，此字母出現(xiàn)的次數(shù)為原始的字符串長度減去替代后的字符串長度。循環(huán)迭代找出長度最長的字母。
2008-03-03