1：BOM（Browser Object Model）概念

window對象是BOM中所有對象的核心。

2：window屬性（較少用）

self：self代表自己，相當於window。

　 window.self; //指向自身窗口

parent：返回父窗口。

top：返回頂層窗口，和parent作用一樣。

opener：窗口開啟者。

3：window方法

1.window.open(url, name, feature, replace);

url：一個可選的字符串，聲明了要在新窗口中顯示的文檔的 URL。如果省略了這個參數，或者它的值是空字符串，那麽新窗口就不會顯示任何文檔。

name：一個可選的字符串，該字符串是一個由逗號分隔的特征列表，其中包括數字、字母和下劃線，該字符聲明了新窗口的名稱。

這個名稱可以用作標記 <a> 和 <form> 的屬性 target 的值。

feature：自行擴展。replace：自行擴展。

谷歌默認會把系統自動打開的新網頁阻止掉，但不阻止通過事件打開新的網頁。

2.close：關閉瀏覽器。（window.close()//關閉瀏覽器窗口）

但都支持通過別的網頁打開的新的網頁關閉。

3.alert(顯示的文本)：彈出窗。（window.alert()//瀏覽器窗口彈框）

4.confirm(對話框提示的文字)：該方法有返回值，點擊確定返回true，點擊取消返回false。

console.log(window.confirm(‘今天下雪了嗎？‘)); //點擊確認輸出true；點擊取消輸出false

5.prompt(提示信息)：輸入框。點擊確定返回字符串，點擊取消返回null。

console.log(window.prompt(‘請問1+1等於幾？‘));
//彈出窗口有書寫區域，返回值為輸入的信息，若不填寫為null

4：history對象

該對象包含瀏覽器窗口訪問過的url。

1.屬性

length 返回瀏覽器歷史記錄的數量

2.方法(使用以下方法返回網頁history的記錄不增不減)

back() 後退，加載前一個url。

forward() 前進。

go(number) 如果參數是正數，那麽就是前進相應的數目，如果是負數那麽反之，如果是0那麽就是刷新。

5：location對象

包含有當前url的相關信息，而history對象不能具體反應url的相關信息。

屬性：

href：設置或返回完整的url。可以為相對路徑，也可以為絕對路徑。

search：返回url?後面的查詢部分。

hash ：是一個可讀可寫的字符串，該字符串是 URL 的錨部分（從 # 號開始的部分）。

方法：

assign(url)：加載新的文檔。

reload(boolean)：重新加載文檔，當參數是true，任何時候都會重新加載，false的時候，只有在文檔改變的時候才會加載，否則直接讀取內存當中的。

replace(url)：用新的文檔代替當前的文檔。但不會在 History 對象中生成一個新的記錄。當使用該方法時，新的 URL 將覆蓋 History 對象中的當前記錄。

6：navigator對象

userAgent：用戶代理信息，通過該屬性可獲取瀏覽器及操作系統信息。可通過此對象查看瀏覽器的信息，項目的不兼容此版本瀏覽器可給出用戶的相關建議。

console.log(navigator.userAgent);

7：window事件

• onresize：窗口縮放事件。

window.onresize = function () {
	console.log(2)
}

• onload：加載事件網頁加載完畢後執行。// 獲取瀏覽器視窗寬度/高度

window.onload = function () {
	console.log(document.documentElement.clientWidth)
	console.log(document.documentElement.clientHeight)
}

• onscroll：滾動事件。// 獲取瀏覽器滾動條隱藏的寬度/高度

chrome(body)、火狐、IE(documentElement)

通過分裝方法兼容各版本的瀏覽器：

　　window.onscroll = function () {
　　　　var iScrollT = document.documentElement.scrollTop || document.body.scrollTop;
　　　　var iScrollL = document.documentElement.scrollLeft || document.body.scrollLeft;
　　　　console.log(iScrollL)
　　}

從零開始學習前端JAVASCRIPT — 5、JavaScript基礎BOM