BOM 是 browser object model 的縮寫， 簡稱瀏覽器對象模型欧啤。 主要處理瀏覽器窗口和框架，
描述了與瀏覽器進行交互的方法和接口， 可以對瀏覽器窗口進行訪問和操作末盔， 譬如可以彈出
新的窗口， 回退歷史記錄座慰， 獲取 url……
BOM 與 DOM 的關(guān)系
- javacsript 是通過訪問 BOM 對象來訪問陨舱、 控制、 修改瀏覽器
- BOM 的 window 包含了 document版仔， 因此通過 window 對象的 document 屬性就可以訪問游盲、
檢索、 修改文檔內(nèi)容與結(jié)構(gòu)蛮粮。 - document 對象又是 DOM 模型的根節(jié)點益缎。
因此， BOM 包含了 DOM然想， 瀏覽器提供出來給予訪問的是 BOM 對象莺奔， 從 BOM 對象再訪
問到 DOM 對象， 從而 js 可以操作瀏覽器以及瀏覽器讀取到的文檔
BOM 對象包含哪些內(nèi)容又沾？
- Window JavaScript 層級中的頂層對象弊仪， 表示瀏覽器窗口。
- Navigator 包含客戶端瀏覽器的信息杖刷。
- History 包含了瀏覽器窗口訪問過的 URL励饵。
- Location 包含了當(dāng)前 URL 的信息。
- Screen 包含客戶端顯示屏的信息滑燃。
History 對象
History 對象包含用戶（在瀏覽器窗口中） 訪問過的 URL
| 方法/屬性 | 描述 |
|---|---|
| length | 返回瀏覽器歷史列表中的 URL 數(shù)量役听。 |
| back() | 加載 history 列表中的前一個 URL。 |
| forward() | 加載 history 列表中的下一個 URL。 |
| go() | 加載 history 列表中的某個具體頁面 |
Location 對象
Location 對象包含有關(guān)當(dāng)前 URL 的信息典予。
| 屬性 | 描述 |
|---|---|
| hash | 設(shè)置或返回從井號 (#) 開始的 URL（錨） 甜滨。 |
| host | 設(shè)置或返回主機名和當(dāng)前 URL 的端口號。 |
| hostname | 設(shè)置或返回當(dāng)前 URL 的主機名瘤袖。 |
| href | 設(shè)置或返回完整的 URL衣摩。 |
| pathname | 設(shè)置或返回當(dāng)前 URL 的路徑部分。 |
| port | 設(shè)置或返回當(dāng)前 URL 的端口號捂敌。 |
| protocol | 設(shè)置或返回當(dāng)前 URL 的協(xié)議艾扮。 |
| search | 置或返回從問號 (?) 開始的 URL（查詢部分） 。 |
| 方法 | 描述 |
|---|---|
| assign() | 加載新的文檔占婉。 |
| reload(‘force’) | 重新加載當(dāng)前文檔泡嘴。參數(shù)可選，不填或填 false 則取瀏覽器緩存的文檔 |
| replace() | 用新的文檔替換當(dāng)前文檔逆济。 |
Window 對象
Window 對象表示一個瀏覽器窗口或一個框架酌予。 在客戶端 JavaScript 中， Window 對象
是全局對象奖慌，所有的表達式都在當(dāng)前的環(huán)境中計算抛虫。 例如，可以只寫 document简僧， 而
不必寫 window.document莱褒。
| 屬性 | 描述 |
|---|---|
| closed | 返回窗口是否已被關(guān)閉。 |
| defaultStatus | 設(shè)置或返回窗口狀態(tài)欄中的默認文本涎劈。 （僅 Opera 支持） |
| document | 對 Document 對象的只讀引用广凸。 請參閱 Document 對象。 |
| history | 對 History 對象的只讀引用蛛枚。 請參數(shù) History 對象谅海。 |
| innerheight | 返回窗口的文檔顯示區(qū)的高度。 |
| innerwidth | 返回窗口的文檔顯示區(qū)的寬度蹦浦。 |
| length | 設(shè)置或返回窗口中的框架數(shù)量扭吁。 |
| location | 用于窗口或框架的 Location 對象。 請參閱 Location 對象盲镶。 |
| name | 設(shè)置或返回窗口的名稱侥袜。 |
| Navigator | 對 Navigator 對象的只讀引用。 請參數(shù) Navigator 對象溉贿。 |
| opener | 返回對創(chuàng)建此窗口的窗口的引用枫吧。 |
| outerheight | 返回窗口的外部高度。 |
| outerwidth | 返回窗口的外部寬度宇色。 |
| pageXOffset | 設(shè)置或返回當(dāng)前頁面相對于窗口顯示區(qū)左上角的 X 位置九杂。 |
| pageYOffset | 設(shè)置或返回當(dāng)前頁面相對于窗口顯示區(qū)左上角的 Y 位置颁湖。 |
| parent | 返回父窗口。 |
| Screen | 對 Screen 對象的只讀引用例隆。 請參數(shù) Screen 對象甥捺。 |
| self | 返回對當(dāng)前窗口的引用。 等價于 Window 屬性镀层。 |
| status | 設(shè)置窗口狀態(tài)欄的文本镰禾。 (默認只支持 Opera) |
| top | 返回最頂層的先輩窗口。 |
| window | window 屬性等價于 self 屬性唱逢， 它包含了對窗口自身的引用羡微。 |
| screenLeft screenTop screenX screenY |
只讀整數(shù)。聲明了窗口的左上角在屏幕上的的 x 坐標和 y 坐標惶我。 IE、 Safari博投、 Chrome 和 Opera 支持 screenLeft 和 screenTop绸贡， 而 Chrome、 Firefox 和 Safari 支持 screenX 和 screenY毅哗。 |
| 方法 | 描述 |
|---|---|
| alert() | 顯示帶有一段消息和一個確認按鈕的警告框听怕。 |
| blur() | 把鍵盤焦點從頂層窗口移開。 |
| confirm() | 顯示帶有一段消息以及確認按鈕和取消按鈕的對話框虑绵。 |
| createPopup() | 創(chuàng)建一個彈出窗口尿瞭。 只有 ie 支持（不包括 ie11） |
| focus() | 把鍵盤焦點給予一個窗口。 |
| moveBy() | 可相對窗口的當(dāng)前坐標把它移動指定的像素翅睛。 |
| moveTo() | 把窗口的左上角移動到一個指定的坐標声搁。 |
| open() | 打開一個新的瀏覽器窗口或查找一個已命名的窗口。 window.open(URL,name,features,replace) |
| print() | 打印當(dāng)前窗口的內(nèi)容捕发。 |
| prompt() | 顯示可提示用戶輸入的對話框疏旨。 |
| resizeBy() | 按照指定的像素調(diào)整窗口的大小。 |
| resizeTo() | 把窗口的大小調(diào)整到指定的寬度和高度扎酷。 |
| scrollBy() | 按照指定的像素值來滾動內(nèi)容檐涝。 |
| scrollTo() | 把內(nèi)容滾動到指定的坐標。 |
| setInterval() | 按照指定的周期（以毫秒計） 來調(diào)用函數(shù)或計算表達式法挨。 |
| setTimeout() | 在指定的毫秒數(shù)后調(diào)用函數(shù)或計算表達式谁榜。 |
| clearInterval() | 取消由 setInterval() 設(shè)置的 timeout。 |
| clearTimeout() | 取消由 setTimeout() 方法設(shè)置的 timeout凡纳。close() 關(guān)閉瀏覽器窗口 |
Navigator 對象
Navigator 對象包含的屬性描述了正在使用的瀏覽器窃植。 可以使用這些屬性進行平臺專用的配置。 雖然這個對象的名稱顯而易見的是 Netscape 的 Navigator 瀏覽器荐糜， 但其他實現(xiàn)了 JavaScript 的瀏覽器也支持這個對象撕瞧。
| 屬性 | 描述 |
|---|---|
| appCodeName | 返回瀏覽器的代碼名陵叽。 以 Netscape 代碼為基礎(chǔ)的瀏覽器中， 它的值是 "Mozilla"丛版。Microsoft 也是 |
| appMinorVersion | 返回瀏覽器的次級版本巩掺。 （IE4、 Opera 支持） |
| appName | 返回瀏覽器的名稱页畦。 |
| appVersion | 返回瀏覽器的平臺和版本信息胖替。 |
| browserLanguage | 返回當(dāng)前瀏覽器的語言。 （IE 和 Opera 支持）cookieEnabled 返回指明瀏覽器中是否啟用 cookie 的布爾值豫缨。 |
| cpuClass | 返回瀏覽器系統(tǒng)的 CPU 等級独令。 （IE 支持） |
| onLine | 返回指明系統(tǒng)是否處于脫機模式的布爾值。 |
| platform | 返回運行瀏覽器的操作系統(tǒng)平臺好芭。 |
| systemLanguage | 返回當(dāng)前操作系統(tǒng)的默認語言燃箭。 （IE 支持） |
| userAgent | 返回由客戶機發(fā)送服務(wù)器的 user-agent 頭部的值。 |
| userLanguage | 返回操作系統(tǒng)設(shè)定的自然語言舍败。 （IE 和 Opera 支持） |
| plugins | 返回包含客戶端安裝的所有插件的數(shù)組 |
| 方法 | 描述 |
|---|---|
| javaEnabled() | 規(guī)定瀏覽器是否支持并啟用了 Java招狸。 |
| taintEnabled() | 規(guī)定瀏覽器是否啟用數(shù)據(jù)污點 (data tainting)。 |
Screen 對象
Screen 對象包含有關(guān)客戶端顯示屏幕的信息邻薯。 每個 Window 對象的 screen 屬性都引用一個 Screen 對象裙戏。 Screen 對象中存放著有關(guān)顯示瀏覽器屏幕的信息。 JavaScript 程序?qū)⒗眠@些信息來優(yōu)化它們的輸出厕诡， 以達到用戶的顯示要求累榜。 例如，一個程序可以根據(jù)顯示器的尺寸選擇使用大圖像還是使用小圖像灵嫌，它還可以根據(jù)顯示器的顏色深度選擇使用 16 位色還是使用 8 位色的圖形壹罚。 另外，JavaScript 程序還能根有關(guān)屏幕尺寸的信息將新的瀏覽器窗口定位在屏幕中間寿羞。
| 屬性 | 描述 |
|---|---|
| availHeight | 返回顯示屏幕的高度 (除 Windows 任務(wù)欄之外)渔嚷。 |
| availWidth | 返回顯示屏幕的寬度 (除 Windows 任務(wù)欄之外)。 |
| bufferDepth | 設(shè)置或返回調(diào)色板的比特深度稠曼。 （僅 IE 支持）colorDepth 返回目標設(shè)備或緩沖器上的調(diào)色板的比特深度形病。 |
| deviceXDPI | 返回顯示屏幕的每英寸水平點數(shù)。 （僅 IE 支持） |
| deviceYDPI | 返回顯示屏幕的每英寸垂直點數(shù)霞幅。 （僅 IE 支持） |
| fontSmoothingEnabled | 返回用戶是否在顯示控制面板中啟用了字體平滑漠吻。 （僅 IE 支持） |
| height | 返回顯示屏幕的高度。 |
| logicalXDPI | 返回顯示屏幕每英寸的水平方向的常規(guī)點數(shù)司恳。 （僅 IE 支持） |
| logicalYDPI | 返回顯示屏幕每英寸的垂直方向的常規(guī)點數(shù)途乃。 （僅 IE 支持） |
| pixelDepth | 返回顯示屏幕的顏色分辨率（比特每像素） 。 |
| updateInterval | 設(shè)置或返回屏幕的刷新率扔傅。 （僅 IE11 以下支持） |
| width | 返回顯示器屏幕的寬度耍共。 |
檢測瀏覽器版本版本有哪些方式烫饼？
- 根據(jù) navigator.userAgent // UA.toLowerCase().indexOf('chrome')
- 根據(jù) window 對象的成員 // 'ActiveXObject' in window
offsetWidth/offsetHeight,clientWidth/clientHeight 與 scrollWidth/scrollHeight 的區(qū)別
- offsetWidth/offsetHeight 返回值包含 content + padding + border，效果與 e.getBoundingClientRect()相同
- clientWidth/clientHeight 返回值只包含 content + padding试读，如果有滾動條杠纵，也不包含滾動條
- scrollWidth/scrollHeight 返回值包含 content + padding + 溢出內(nèi)容的尺寸
