JavaScript提供了一組以window為核心的對象,實現了對浏覽器窗口的訪問控制。JavaScript中定義了6種重要的對象:
window對象 表示浏覽器中打開的窗口;
document對象 表示浏覽器中加載頁面的文檔對象;
location對象包含了浏覽器當前的URL信息;
navigation對象 包含了浏覽器本身的信息;
screen對象 包含了客戶端屏幕及渲染能力的信息;
history對象 包含了浏覽器訪問網頁的歷史信息。
除了window對象之外,其他的5個對象都是window對象的屬性,它們的關系如下圖:
一、window對象
window對象就是JavaScript的Global對象,所以在使用window對象的屬性和方法是不需要特別指明。如:alert,實際上完整的調用是window.alert,通常省略了window對象的引用。
1. windows對象的屬性、方法、和事件
2. window對象提供的主要功能:
調整窗口的尺寸和位置、打開新窗口、系統提示框、狀態欄控制、定時操作,下面分別對這5個功能詳細講述。
(1) 調整窗口的尺寸和位置
方法
用法
說明
window.moveBy
將浏覽器窗口移動到指定位置(相對定位)
window.moveBy(dx,dy)
出於安全性和對用戶有好的考慮,不允許使用JavaScript腳本將窗口移動到可視區域之外,必須始終保證浏覽器窗口在屏幕的可視區域。
window.moveTo
將浏覽器窗口移動到指定位置
(絕對定位)
window.moveBy(x,y)
如果指定的坐標(x,y)會使部分或全部窗口置於可視區域之外,那麼窗口將停留在最接近屏幕邊緣的位置。
window.resizeBy
將浏覽器窗口的尺寸改變指定的寬度和高度(相對調整窗口大小)
window.resizeBy(dw,dh)
window.resizeTo
將浏覽器窗口的尺寸改變指定的寬度和高度(絕對調整窗口大小)
window.resizeTo(w,h)
指定的寬度和高度不能為負數
(2) 打開新窗口
用法:window.open([url],[target],[options])
參數url:打開新新窗口將要加載的url。如果未指定參數,將默認加載空白頁。如:window.open("test.htm");
參數target:新打開窗口的定位目標或者名稱
_self 在當前窗口加載新頁面
_blank 在新窗口加載新頁面
_parent 在父窗口加載新頁面
_top在頂層窗口加載新頁面
參數options:新打開窗口的屬性,是由若干個選項組成,選項之間用逗號分隔開,每個選項都包含了選項的名稱和值。
選項
說明
height
窗口的高度,單位像素
width
窗口的寬度,單位像素
left
窗口的左邊緣位置
top
窗口的上邊緣位置
fullscreen
是否全屏,默認值no
location
是否顯示地址欄,默認值yes
menubar
是否顯示菜單欄,默認值yes
resizable
是否允許改變窗口大小,默認值yes
scrollbars
是否顯示滾動條,默認值yes
status
是否顯示狀態欄,默認值yes
titlebar
是否顯示標題欄,默認值yes
toolbar
是否顯示工具條,默認值yes
(3) 系統提示框
window.alert 顯示消息提示框,用法 window.alert([Message]); (注:一般都省略window對象,直接使用alert)
window.confirm 顯示一個確認對話框,其中包括“確定”和“取消”按鈕。
window.prompt 顯示一個消息提示框,其中包含一個文本輸入框。
用法:window.prompt([Message],[default]); Message是顯示在提示框上的文本,default是設置文本框的默認值。
(4) 狀態欄控制
通過window.status屬性進行控制。如:window.status="錯誤提示"; 這樣做會影響用戶體驗,所以不建議對狀態欄信息進行修改。
(5) 定時操作
定時操作是web開發中常用功能,在基於Ajax技術的開發中,有一類應用需要定時的訪問後台服務器並且更新前台頁面,這類應用實現通常依賴於定時操作函數。
定時操作函數有四個:window.setInterval、window.clearInterval、window.setTimeout、window.clearTimeout,這四個函數都是window對象的方法,這說明浏覽器中的定時操作是由浏覽器窗口完成的。下面對這四種方法的用法詳細介紹。
① window.setInterval 設置定時器,每隔一段時間執行指定的代碼 window.setInterval(code,time);
說明: code參數可以是一個函數,也可以是一個字符串形式的JavaScript代碼
time參數是執行代碼的時間間隔,單位是ms。
② window.clearInterval 清除setInterval函數設置的定時器 window. clearInterval(time);
③ window.setTimeout 設置定時器,每隔一段時間執行指定的代碼 window.setTimeout(code,time);
說明: code參數可以是一個函數,也可以是一個字符串形式的JavaScript代碼,setTimeout與setInterval區別在於setTimeout對指定的代碼只執行一次。
time參數是執行代碼的時間間隔,單位是ms。
④ window.clearTimeout 清除 setTiimeout 函數設置的定時器 window. clearTimeout(time);
以上這篇JavaScript浏覽器對象之一Window對象詳解就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持。