BOM概述

BOM:Browser Object Model,瀏覽器對象模型,用來訪問和操作瀏覽器窗口,使JS有能力與瀏覽器交互。

——通過使用BOM,可移動窗口、更改狀態欄文本、執行其他不與頁面內容發生直接聯繫的操作,沒有相關標準,當被廣泛支持

BOM對象主要包括以下對象

對象名稱 含義
window 表示瀏覽器中打開的窗口
navigator 包含有關瀏覽器的信息
screen 包含有關客戶端顯示屏幕的信息
history 包含用戶訪問過的URL
location 包含有關當前URL的信息
document 包含當前瀏覽器加載的文檔信息
event 包含當前所觸發的時間對象

window對象是BOM的根對象,其他對象其實都是window對象的屬性,window對象的屬性和方法都可以省略window
window對象常用屬性

屬性名 含義
defaultStatus 設置或返回窗口狀態欄中的默認文本。
innerheight 返回窗口文檔顯示區的高度
innerwidth 返回窗口文檔顯示區的寬度
length 設置或返回窗口中的框架的數量
name 設置或返回窗口的名稱
opener 返回對創建此窗口的窗口引用
outerheight 返回窗口的外部高度
outerwidth 返回窗口的外部寬度
pageXOffset 設置或返回當前頁面相對於窗口顯示區左上角的X位置
pageYOffset 設置或返回當前頁面相對於窗口顯示區左上角的Y位置
parent 返回父窗口
self 返回對當前窗口的引用
status 設置窗口狀態欄的文本
top 返回最頂層的先輩窗口

window對象常用方法

alert() 顯示帶有一段消息和一個確認按鈕的警告框
blur() 把鍵盤焦點從頂層移開
clearInterval() 取消由setInterval()設置的timeout
clearTimeout() 取消由setTimeout()設置的timeout
close() 關閉瀏覽器窗口
confirm() 顯示帶有一段信息以及確認和取消按鈕的對話框
focus() 把鍵盤焦點給予一個窗口
open() 打開一個新的瀏覽器窗口
print() 打印當前窗口的內容
prompt 顯示提示用戶輸入的對話框
setInterval 設置週期性定時器
setTimeout 設置一次性定時器
   

窗口的大小與定位

window.innerHeight/Width:瀏覽器窗口的可見區域

window.outerHeight/Width:瀏覽器窗口的外邊框整體區域

screen.height/width:顯示器完整分辨率

screen.availHeight/Width:顯示器除去任務欄的剩餘部分辨率

調整大小

resizeTo(newWidth,newHeight)

resizeBy(changWidth,changHeight)

window.screenLeft||window.screenX     左上角X座標

window.screenTop||window.screenY      左上角Y座標

event.screenX/Y:事件發生時,鼠標距離顯示器左上角的座標

移動窗口位置

window.moveTo(newX,newY)

window.moveBy(changeX,changY);

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章