瀏覽器對象模型 Browser Object Model
Window Javascript層級中的頂層對象,表示瀏覽器窗口
屬性:
history
location
navigator
screen
詳情見下
innerWidth 返回窗口的文檔顯示區(qū)的寬度
innerHeight 返回窗口的文檔顯示區(qū)的高度
就是X Y滾動條的位置
pageXOffset 設(shè)置或返回當(dāng)前頁面相對于窗口顯示區(qū)左上角的 X 位置
pageYOffset 設(shè)置或返回當(dāng)前頁面相對于窗口顯示區(qū)左上角的 Y 位置
聲明了瀏覽器窗口距離屏幕左上角的距離X,Y
scrollTop (IE、Safari、Chrome、Opera)
scrollLeft
scrollX (Chrome、Firefox、Safari)
scrollY
方法:
alert() 顯示帶有一段消息和一個確認(rèn)按鈕的警告框
clearInterval() 取消由 setInterval() 設(shè)置的計時器
clearSetTimeout() 取消由 setTimeout() 設(shè)置的計時器
close() 關(guān)閉瀏覽器窗口
comfirm() 顯示帶有一段消息以及確認(rèn)按鈕和取消按鈕的對話框
moveBy() 可相對窗口的當(dāng)前坐標(biāo)把它移動指定的像素
moveTo() 把窗口的左上角移動到一個指定的坐標(biāo)
open()
//第一個參數(shù)是地址,第二個參數(shù)是name,第三個是新窗口頁面大小,并彈出瀏覽器到外,不寫則在瀏覽器內(nèi)打開。
window.open("https://www.google.com.hk","name","width=200,height = 200;")
prompt() 顯示可提示用戶輸入的對話框,并返回輸入內(nèi)容

let abcd = window.prompt("123")
console.log(abcd) //接受輸入框輸入的內(nèi)容
resizeBy() 按照指定的像素調(diào)整窗口的大小
resizeTo() 把窗口的大小調(diào)整到指定的寬度和高度
scrollBy(x, y) 按照指定的像素值來滾動內(nèi)容 兩個參數(shù),x y
scrollTo(x, y) 把內(nèi)容滾動到指定的坐標(biāo) 兩個參數(shù),x y
setInterval() 按照指定的周期(以毫秒計)來調(diào)用函數(shù)或計算表達(dá)式
let timer1 = setInterval(function(){
console.log("每兩秒執(zhí)行一次")
},2000)
timer1;
setTimeout() 在指定的毫秒數(shù)后調(diào)用函數(shù)或計算表達(dá)式
let timer = setTimeout(function(){
console.log("五秒后執(zhí)行")
},5000)
timer;
Navigator 包含客戶端瀏覽器信息
appCodeName 返回瀏覽器的代碼名 Mozilla
appMinorVersion 返回瀏覽器的次級版本 (IE4 oprea)
appName 返回瀏覽器名稱
appVersion 返回瀏覽器的平臺和版本信息
browserLanguage 返回當(dāng)前瀏覽器的語言(IE4 oprea)
cookieEnabled 返回指明瀏覽器中是否啟用cookie的布爾值
cpuClass 返回瀏覽器系統(tǒng)的CPU等級 (IE)
onLine 返回指明系統(tǒng)是否處于脫機狀態(tài)
platform 返回運行瀏覽器的操作系統(tǒng)平臺
systemLanguage 返回當(dāng)前操作系統(tǒng)的默認(rèn)語言(IE)
userAgent 返回由客戶機發(fā)送服務(wù)器的user-agent頭部的值
userLanguage 返回操作系統(tǒng)設(shè)定的自然語言(IE4 oprea)
plugins 返回包含客戶端安裝所有插件的數(shù)組

History 包含了瀏覽器窗口訪問過的URL
屬性:
history.length 返回瀏覽器歷史列表中的URL的數(shù)量
方法:
history.back() 加載 history 列表中的前一個URL
history.forward() 加載 history 列表中的后一個URL
history.go() 加載 history 列表中的某個具體頁面
history.back(-1);
history.forward(1);
history.go(3);
Location 包含了當(dāng)前URL的信息
屬性:
以簡書網(wǎng)站為例,修改了網(wǎng)站URL信息http://www.itdecent.cn/?&123#1
location.hash 設(shè)置或返回從#號開始的URL
location.host 設(shè)置或返回主機名和當(dāng)前URL的端口號
location.hostname 設(shè)置或返回當(dāng)前 URL 的主機名
location.href 設(shè)置或返回完成的URL
location.pathname 設(shè)置或返回當(dāng)前 URL 的路徑部分。
location.port 設(shè)置或返回當(dāng)前 URL 的端口號。
location.protocol 設(shè)置或返回當(dāng)前 URL 的協(xié)議
location.search 設(shè)置或返回從問號 (?) 開始的 URL(查詢部分)

方法:
location.assign() 加載新文檔
location.assign("https://www.google.com.hk")
location.reload() 重新加載當(dāng)前文檔,相當(dāng)于刷新。參數(shù)可選,不填或者填false則取瀏覽器緩存的文檔
location.reload(true) // 重服務(wù)器重新抓取
location.reload(false) // 從緩存中拉取
location.replace() 用新的文檔替換當(dāng)前文檔,無歷史記錄
location.replace("https://www.google.com.hk")
Screen 包含了客戶端顯示屏的信息
availWidth 可用的屏幕寬度
availHeight 可用的屏幕高度
以上兩個屬性,以像素計,減去界面特性,比如窗口任務(wù)欄。
width 返回屏幕寬度
height 返回屏幕高度
let w = screen.availWidth;
let h = screen.availHeight;