關於BOM的學習總結

標籤：style   color   io   使用   for   問題   sp   on   c   

第四章 瀏覽器對象模（BOM）總結

　　本章主要講解了瀏覽器物件模型BOM的基本概念，以及window、document、location、navigator和screen五個對象的常用屬性及方法。

　　其中window對象是BOM的核心，我們可以通過window的moveBy()、resizeTo()等方法移動、調節瀏覽器視窗位置、大小。但由於缺乏相應標準，不同的瀏覽器在使用該方法時得到的結果並不一樣，例如，若使用moveBy(100,100)移動視窗，只有IE下能得到正確的結果，Chrome和FF卻得到不同的結果或者有些情況下甚至沒有任何效果。值得一提的是，IE提供了window.screenLeft和window.screenTop對象來判斷瀏覽器視窗位置，在IE8中，這兩個對象擷取的是瀏覽器視窗視口左上方的位置（不包括頂部功能表列），Chrome和FF也支援此屬性，但所擷取的是整個瀏覽器左上方的位置，不過在較新的IE11中，所擷取的位置已經與Chrome和FireFox達成了一致。並且window對象的特性字串也只在IE下可用，例如scrollable、resizable等，Chrome和FF根本不支援此屬性。

　　Window對象下還有一個opener屬性，用於新視窗對開啟它的父視窗的引用，但是此屬性在IE8下並不支援。

　　Window對象下我們用到較多的兩個方法便是時間暫停setTimeout()和時間間隔setInterval()兩個方法，網頁上的廣告圖片輪播便可以它們來實現。

本章中另外一個重要的對象便是document。它是唯一一個既屬於BOM又屬於DOM的對象。較為有意思的是write()方法其實是屬於BOM下的document的一個方法，這裡也就產生了一個問題，如何區分document的方法和屬性到底屬於BOM還是DOM呢？書上列舉了document的forms和images集合，但通過document.forms[0]獲得的表單的nodeType值為1，分明是文檔結構模型中的一個元素節點，這兩者之間到底有沒有一個明確的區分界限呢？

　　BOM中另外三個對象location、navigator和screen似乎在日常應用中相當較少。但其實它們還是有用武之地的，例如，在本次JS打飛機遊戲中，我便通過給“重新開始”按鈕添加一個location.reload()方法來重新載入了頁面。而同樣由於缺乏標準，navigator對象的屬性和方法就形成了一片混亂。Screen對象下的colorDepth方法在IE8下得到的是顏色位元是32位，而Chrome和FF下則是24位，但在IE11下，它也是24位了，這樣的改變對於我們前端開發人員而言，無疑是一個較大的福音。

　　技術的提升不能只靠保守自己的固有資本，樂於分享、善於學習，才能使我們收穫更多，連微軟都可以改變，我們為什麼不能呢？

關於BOM的學習總結