JavaScript基礎（七）BOM--Browser Object Model瀏覽器對象模型

BOM：(Browser Object Mode) 瀏覽器對象模型。

1. BOM是browser object model的縮寫，簡稱瀏覽器對象模型
2. BOM提供了獨立於內容而與瀏覽器窗口進行交互的對象
3. 因爲BOM主要用於管理窗口與窗口之間的通信，所以其核心對象是window
4. BOM由一系列相關的對象構成，而且每一個對象都提供了不少方法與屬性
5. BOM缺少標準，JavaScript語法的標準化組織是ECMA，DOM的標準化組織是W3C
6. BOM最初是Netscape瀏覽器標準的一部分

BOM中定義了6種重要的對象：

1. window對象表示瀏覽器中打開的窗口；
2. document對象表示瀏覽器中加載頁面的文檔對象；
3. location對象包含了瀏覽器當前的URL信息；
4. navigator對象包含了瀏覽器自己的信息；
5. screen對象包含了客戶端屏幕及渲染能力的信息；
6. history對象包含了瀏覽器訪問網頁的歷史信息。

在瀏覽器宿主環境下，window對象就是JavaScript的Global對象，所以使用window對象的屬性和方法是不須要特別指明的。好比alert完整的調用形式應該是window.alert。

window對象對應着Web瀏覽器的窗口，使用它能夠直接對瀏覽器窗口進行操做。window對象提供的主要功能能夠分爲如下5類：

1. 調整窗口的大小和位置；
2. 打開新窗口；
3. 系統提示框；
4. 狀態欄控制；
5. 定時操做。

1. 調整窗口的大小和位置；
（1）window.moveBy
該方法將瀏覽器窗口移動指定的距離（相對定位）。
用法：window.moveBy(dx, dy)
（2）window.moveTo
該方法將瀏覽器窗口移動到指定的位置（絕對定位）。
用法：window.moveTo(x, y)
（3）window.resizeBy
該方法將瀏覽器窗口的大小改變爲指定的寬度和高度（相對調整窗口大小）。
用法：window.resizeBy(dw, dh)
（4）window.resizeTo
該方法將瀏覽器窗口的大小改變爲指定的寬度和高度（絕對調整窗口大小）。
用法：window.resizeTo(w, h)

2. 打開新窗口；
用法：window.open([url] [, target] [, options])
options參數可能的選項包括：
（1）height: 窗口的高度，單位爲像素；
（2）width：窗口的寬度，單位爲像素；
（3）left：窗口的左邊緣位置；
（4）top：窗口的上邊緣位置；
（5）fullscreen：是否全屏，默認值爲no；
（6）location: 是否顯示地址欄，默認值爲yes；
（7）menubar: 是否顯示菜單項，默認值爲yes；
（8）resizable: 是否容許改變窗口大小，默認值爲yes；
（9）scrollbars: 是否顯示滾動條，默認值爲yes；
（10）status: 是否顯示狀態欄，默認值爲yes；
（11）titlebar: 是否顯示標題欄，默認值爲yes；
（12）toolbar: 是否顯示工具條，默認值爲yes。（7）menubar: 是否顯示菜單項，默認值爲yes；
（8）resizable: 是否容許改變窗口大小，默認值爲yes；
（9）scrollbars: 是否顯示滾動條，默認值爲yes；
（10）status: 是否顯示狀態欄，默認值爲yes；
（11）titlebar: 是否顯示標題欄，默認值爲yes；
（12）toolbar: 是否顯示工具條，默認值爲yes。

3．系統對話框；

（1）window.alert
該方法將顯示消息提示框。
用法：window.alert([message])
（2）window.confir
該方法將顯示一個確認提示框，其中包括「肯定」和「取消」按鈕。
用戶單擊「肯定」按鈕時，window.confirm返回true；單擊「取消」按鈕時，window.confirm返回false。
 用法：window.confirm([message])
（3）window.prompt
該方法將顯示一個消息提示框，其中包含一個文本輸入框。
用法：window.prompt([message] [, default])
（4）狀態欄控制
瀏覽器狀態的顯示信息能夠經過window.status屬性直接進行修改。
（5）定時操做
定時操做一般有兩種使用目的，一種是週期性地執行腳本，例如在頁面上顯示時鐘，須要每隔一秒鐘更新一次，
另外一種則是將某個操做延時一段時間執行，例如某個特別耗時的操做，可使用window.setTimeout函數使其延時執行，
然後面的腳本能夠繼續運行不受影響。
    1）window.setInterval
    該函數用於設置定時器，每隔一段時間執行指定的代碼。
    用法：window.setInterval(code, interval)
    2）window.clearInterval
    該函數用於清除setInterval函數設置的定時器。
    用法：window.clearInterval(timer)
    3）window.setTimeout
    該函數用於設置定時器，在一段時間以後執行指定的代碼。
   用法：window.setTimeout(code, time)
    4）window.clearTimeout
    該函數用於清除setTimeout函數設置的定時器。
    用法：window.clearTimeout(timer)

document對象
document對象其實是window的屬性，document對象的獨特之處是它既屬於BOM又屬於DOM。
從BOM角度看，document對象由一系列集合構成，這些集合能夠訪問文檔的各個部分，並提供頁面自身的信息。
因爲BOM沒有統一的標準，各類瀏覽器中的document對象特性並不徹底相同，所以在使用document對象時須要特別注意，
儘可能要使用各種瀏覽器都支持的通用屬性和方法。
（ 1）通用屬性
    1）document.bgColor 
    該屬性爲頁面的背景色。
    2）document.fgColor 
    該屬性爲頁面的前景色。
    3）document.linkColor
    該屬性爲頁面文檔中連接的顏色。
    4）document.vlinkColor
    該屬性爲頁面文檔中訪問過的連接顏色。
    5）document.alinkColor
    該屬性爲頁面文檔中激活連接的顏色。
    6）document.domain
    該屬性爲文檔所在的域名。
    7）document.referrer
    該屬性爲將用戶引入當前頁面的URL。
    8）document.URL
    該屬性爲當前頁面的URL。
    9）document.title
    該屬性爲當前頁面的標題。
    10）document.lastModified
    該屬性爲上次修改頁面的時間。
    11）document.cookie
    該屬性用於設置或者讀取Cookie的值。 

 （ 2）集合屬性
    anchors：返回文檔中全部錨的集合
    說明：IE中document.anchors將返回全部具備name或者id屬性的錨；而在Mozilla Firefox中     
    document.anchors將返回全部具備name屬性的錨
    applets：返回文檔中全部applet的集合
    embeds：返回文檔中全部embed對象的集合
    forms：返回文檔中全部表單的集合
    images：返回文檔中全部img對象的集合
    links：返回文檔中全部連接的集合，即全部設置了href屬性的<a>元素
（3）方法   
    1）document.write/writeln
    該方法用於在當前文檔中輸出文字。
    用法：
    document.write(text)
    document.writeln(text)
    2）document.open
    document.open和document.close是一組方法，一般與document.write/writeln方法配合使用。
    其中，document.open方法用於打開文檔準備寫入內容。
    用法：document.open()
    3）document.close
    該方法用於關閉文檔，同時將寫入的內容輸出到頁面。
    用法：document.close()

location對象
    location.hash：當前頁面的URL中「#」號後面的部分
    location.host：當前頁面的URL中主機名和端口的部分
    location.hostname：主機名
    location.href：當前頁面的URL
    location.pathname：當前頁面的相對路徑
    location.port：端口號
    location.protocol：協議名稱
    location.search：當前頁面的URL中問號後的部分

 navigator對象
    navigator對象包含了關於Web瀏覽器的信息，瀏覽器的類型、版本信息均可以從該對象中獲取。
    navigator.appCodeName：瀏覽器代碼名稱
    navigator.appName：瀏覽器名稱
    navigator.appVersion：瀏覽器運行平臺和版本
    navigator.cookieEnabled：瀏覽器是否接受Cookie

 screen對象
    screen.height：屏幕的垂直分辨率，單位爲像素
    screen.width：屏幕的水平分辨率，單位爲像素
    screen.availHeight：可用的屏幕高度（排除操做系統元素佔用的高度，如Windows任務欄的高度）
    screen.availWidth：可用的屏幕寬度（排除操做系統元素佔用的寬度，如Windows任務欄的寬度）
    說明：一般狀況下Windows任務欄位於窗口底部，此時screen.width與srceen.avialWidth相同
    screen.colorDepth：屏幕的色彩深度

history對象     history.length：瀏覽歷史記錄的總數     history.go(index)：從瀏覽歷史中加載URL，index參數是加載URL的相對位置，index爲負數時表示當前地     址     以前的瀏覽記錄，index爲正數時表示當前地址以後的瀏覽記錄     history.forward()：從瀏覽歷史中加載下一個URL，至關於history.go(1)     history.back()：從瀏覽歷史中加載上一個URL，至關於history.go(-1)