有關BOM(Browser Object Model)的內容

包括：
BOM概述
BOM模型
Window對象（經常使用屬性和方法，窗口的打開，窗口的關閉，模態對話框，定時器）
Navigator對象（遍歷navigator對象的全部屬性，Navigator 對象集合，經常使用屬性和方法）
Location對象（經常使用屬性和方法）
History對象（經常使用屬性和方法）
Screen對象（經常使用屬性）
事件（事件概述，事件句柄，事件處理，阻止事件的默認行爲，事件週期，事件的處理機制）
Event對象（事件對象的經常使用屬性，獲取event對象，使用event對象）
event對象 附錄（事件句柄， 鼠標 / 鍵盤屬性，IE 屬性，標準 Event 屬性，標準 Event 方法）

BOM概述：
    BOM：Browser Object Model,瀏覽器對象模型，用來訪問和操做瀏覽器窗口，使JS有能力與瀏覽器交互。
        經過使用BOM，可移動窗口、更改狀態欄文本、執行其餘不與頁面內容發生直接聯繫的操做。
        沒有相關標準，但被普遍支持。

BOM模型：
    主要包括以下對象：
    window                       表示瀏覽器中打開的窗口
    navigator                    包含有關瀏覽器的信息
    screen                        包含有關客戶端顯示屏幕的信息
    history                        包含用戶（在瀏覽器窗口中）訪問過的URL
    location                       包含有關當前URL的信息
    document                   包含當前瀏覽器加載的文檔信息
    event                           包含當前所觸發的事件對象

   PS：
    window對象是BOM的根對象，其餘對象其實都是window對象的屬性，window對象的屬性和方法均可以省略「window.」，如window.document能夠簡寫爲document，window.alert()能夠簡寫爲alert()。

Window對象：
    若是文檔包含框架（frame或iframe標籤），瀏覽器會爲HTML文檔建立一個window對象，併爲每一個框架建立一個額外的window對象。

    經常使用屬性和方法：
        status    設置窗口狀態欄的文本
        defaultStatus    設置或返回窗口狀態欄中的默認文本。
        length    設置或返回窗口中的框架數量
        name    設置或返回窗口的名稱
        parent    返回父窗口
        top    返回最頂層的先輩窗口。
        opener    返回對建立此窗口的窗口的引用
        self    返回對當前窗口的引用
        innerheight    返回窗口的文檔顯示區的高度
        innerwidth    返回窗口的文檔顯示區的寬度
        outerheight    返回窗口的外部高度
        outerwidth    返回窗口的外部寬度
        pageXOffset    設置或返回當前頁面相對於窗口顯示區左上角的X位置
        pageYOffset    設置或返回當前頁面相對於窗口顯示區左上角的Y位置
       
        closed 返回窗口是否已被關閉。
        document 對 Document 對象的只讀引用。
        history 對 History 對象的只讀引用。
        location 用於窗口或框架的 Location 對象。
        Navigator 對 Navigator 對象的只讀引用。
        Screen 對 Screen 對象的只讀引用。
        window window 屬性等價於 self 屬性，它包含了對窗口自身的引用。
        screenLeft,screenTop,screenX,screenY    聲明瞭窗口的左上角在屏幕上的的 x 座標和 y 座標。IE、Safari 和 Opera 支持 screenLeft 和 screenTop，而 Firefox 和 Safari 支持 screenX 和 screenY。

        alert()    顯示帶有一段消息和一個確認按鈕的警告框。
        confirm()    顯示帶有一段消息以及確認和取消按鈕的對話框。
        prompt()    顯示可提示用戶輸入的對話框。
        blur()    把鍵盤焦點從頂層窗口移開。失去焦點。
        focus()    把鍵盤焦點給予一個窗口。得到焦點。
        close()    關閉瀏覽器窗口
        open()    打開一個新的瀏覽器窗口或查找一個已命名的窗口
        print()    打印當前窗口的內容
        setInterval()    按照指定的週期（以毫秒計）來調用函數或計算表達式
        setTimeout()    在指定的毫秒數後調用函數或計算表達式
        clearInterval()    取消由setInterval()設置的timeout
        clearTimeout()    取消由setTimeout()設置的timeout

        createPopup() 建立一個 pop-up 窗口。
        moveBy() 可相對窗口的當前座標把它移動指定的像素。
        moveTo() 把窗口的左上角移動到一個指定的座標。
        resizeBy() 按照指定的像素調整窗口的大小。
        resizeTo() 把窗口的大小調整到指定的寬度和高度。
        scrollBy() 按照指定的像素值來滾動內容。
        scrollTo() 把內容滾動到指定的座標。

    窗口的打開：
        window.open(URL,name,features,replace)
        URL    可選，聲明瞭要在新窗口中顯示的文檔的 URL。若是省略了這個參數，或者它的值是空字符串，那麼新窗口就不會顯示任何文檔。
        name    可選，聲明瞭新窗口的名稱。這個名稱能夠用做標記 <a> 和 <form> 的屬性 target 的值。若是該參數指定了一個已經存在的窗口，那麼 open() 方法就再也不建立一個新窗口，而只是返回對指定窗口的引用。在這種狀況下，features 將被忽略。
        features    可選，聲明瞭新窗口要顯示的標準瀏覽器的特徵。若是省略該參數，新窗口將具備全部標準特徵。
        replace    可選的布爾值。規定了裝載到窗口的 URL 是在窗口的瀏覽歷史中建立一個新條目，仍是替換瀏覽歷史中的當前條目。true - URL 替換瀏覽歷史中的當前條目。false - URL 在瀏覽歷史中建立新的條目。

        窗口特徵（Window Features）
            channelmode=yes|no|1|0 是否使用劇院模式顯示窗口。默認爲 no。
            directories=yes|no|1|0 是否添加目錄按鈕。默認爲 yes。
            fullscreen=yes|no|1|0 是否使用全屏模式顯示瀏覽器。默認是 no。處於全屏模式的窗口必須同時處於劇院模式。
            height=pixels 窗口文檔顯示區的高度。以像素計。
            left=pixels 窗口的 x 座標。以像素計。
            location=yes|no|1|0 是否顯示地址字段。默認是 yes。
            menubar=yes|no|1|0 是否顯示菜單欄。默認是 yes。
            resizable=yes|no|1|0 窗口是否可調節尺寸。默認是 yes。
            scrollbars=yes|no|1|0 是否顯示滾動條。默認是 yes。
            status=yes|no|1|0 是否添加狀態欄。默認是 yes。
            titlebar=yes|no|1|0 是否顯示標題欄。默認是 yes。
            toolbar=yes|no|1|0 是否顯示瀏覽器的工具欄。默認是 yes。
            top=pixels 窗口的 y 座標。
            width=pixels 窗口的文檔顯示區的寬度。以像素計。

   窗口的關閉：
        close()
        self.close()

    模態對話框：args,features可選參數。
        模態對話框：若不關閉，則父窗口沒法得到焦點；
        window.showModalDialog(url,args,features)
        模態窗口中可使用下列兩個屬性：
        window.dialogArguments：獲取父窗口傳遞的參數
        window.returnValue：設置窗口關閉後能夠傳遞給父窗口的返回值。

        非模態對話框：即便不關閉，父窗口仍能夠得到焦點。
        window.showModelessDialog(url,args,features)
       
    定時器：
        多用於網頁動態時鐘、製做倒計時、跑馬燈效果等。
        週期性時鐘。以必定的間隔執行代碼，循環往復。
        一次性時鐘。在一個設定的時間間隔以後來執行代碼，而不是在函數被調用後當即執行。
   
        週期性定時器，
            setInterval(fn,time)：週期性觸發代碼fn。time時間週期，單位毫秒。
            clearInterval(timeID)：中止啓動定時器
        一次性定時器，
            setTimeout(fn,time)：一次性觸發代碼fn。time時間間隔，單位毫秒。
            clearTimeout(timeID)：中止啓動定時器

= = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = =

Navigator對象：
    經常使用於獲取客戶端瀏覽器和操做系統信息

    遍歷navigator對象的全部屬性
    for(var attr in navigator){
        console.log(attr + ':' + navigator[attr]);
    }

   Navigator 對象集合
        plugins[] 返回對文檔中全部嵌入式對象的引用。該集合是一個 Plugin 對象的數組，其中的元素表明瀏覽器已經安裝的插件。Plug-in 對象提供的是有關插件的信息，其中包括它所支持的 MIME 類型的列表。

    經常使用屬性和方法：
        appCodeName 返回瀏覽器的代碼名。
        appMinorVersion 返回瀏覽器的次級版本。
        appName 返回瀏覽器的名稱。
        appVersion 返回瀏覽器的平臺和版本信息。
        browserLanguage 返回當前瀏覽器的語言。
        cookieEnabled 返回指明瀏覽器中是否啓用 cookie 的布爾值。
        cpuClass 返回瀏覽器系統的 CPU 等級。
        onLine 返回指明系統是否處於脫機模式的布爾值。
        platform 返回運行瀏覽器的操做系統平臺。
        systemLanguage 返回 OS 使用的默認語言。
        userAgent 返回由客戶機發送服務器的 user-agent 頭部的值。
        userLanguage 返回 OS 的天然語言設置。

        javaEnabled() 規定瀏覽器是否啓用 Java。
        taintEnabled() 規定瀏覽器是否啓用數據污點 (data tainting)。

= = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = =

Location對象：
    經常使用於獲取和改變當前瀏覽的網址

    經常使用屬性和方法：
        hash 設置或返回從井號 (#) 開始的 URL（錨）。
        host 設置或返回主機名和當前 URL 的端口號。
        hostname 設置或返回當前 URL 的主機名。
        href 設置或返回完整的 URL。
        pathname 設置或返回當前 URL 的路徑部分。
        port 設置或返回當前 URL 的端口號。
        protocol 設置或返回當前 URL 的協議。
        search 設置或返回從問號 (?) 開始的 URL（查詢部分）。

        assign() 加載新的文檔。
        reload() 從新加載當前文檔。
        replace() 用新的文檔替換當前文檔。

= = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = =

History對象：
    history對象包含用戶（在瀏覽器窗口中）訪問過的URL的歷史記錄

   經常使用的屬性和方法：
        length 返回瀏覽器歷史列表中的 URL 數量。

        back() 加載 history 列表中的前一個 URL。
        forward() 加載 history 列表中的下一個 URL。
        go() 加載 history 列表中的某個具體頁面。

= = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = =

Screen對象：
    經常使用於獲取屏幕的分辨率和色彩。
   
    經常使用屬性：
        availHeight 返回顯示屏幕的高度 (除 Windows 任務欄以外)。
        availWidth 返回顯示屏幕的寬度 (除 Windows 任務欄以外)。
        bufferDepth 設置或返回調色板的比特深度。
        colorDepth 返回目標設備或緩衝器上的調色板的比特深度。
        deviceXDPI 返回顯示屏幕的每英寸水平點數。
        deviceYDPI 返回顯示屏幕的每英寸垂直點數。
        fontSmoothingEnabled 返回用戶是否在顯示控制面板中啓用了字體平滑。
        height 返回顯示屏幕的高度。
        logicalXDPI 返回顯示屏幕每英寸的水平方向的常規點數。
        logicalYDPI 返回顯示屏幕每英寸的垂直方向的常規點數。
        pixelDepth 返回顯示屏幕的顏色分辨率（比特每像素）。
        updateInterval 設置或返回屏幕的刷新率。
        width 返回顯示器屏幕的寬度。

= = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = =

事件：
    事件概述：
        當用戶與web頁面進行某些交互時，解釋器就會建立相應的event對象以描述事件信息。常見的事件有：當用戶點擊頁面上某項內容。鼠標通過特定的元素。用戶按下鍵盤上的某個按鍵。用戶滾動窗口或改變窗口大小。頁面元素加載完成或加載失敗。.....

    事件句柄(Event Handlers)：
        事件句柄（又叫事件處理函數，事件監聽函數），指用於響應某個事件而調用的函數。每個事件均對應一個事件句柄，在程序執行時，將相應的函數或語句指定給事件句柄，則在該事件發生時，瀏覽器便執行指定的函數或語句。鼠標事件...鍵盤事件...狀態事件...

    事件處理：
        爲特定事件定義監聽函數有三種方式：
            1.直接在HTML中定義元素的事件相關屬性。
                onclick="initData()"。
                此語句違反了「內容與行爲相分離」的原則，應儘量少用。

            2.在JS中爲元素的事件相關屬性賦值。
                document.body.onload=initData;
                function initData(){ ... }
                此語句實現了「內容與行爲相分離」，但元素仍只能綁定一個監聽函數。

            3.高級事件處理方式，一個事件能夠綁定多個監聽函數。
                document.body.attachEvent('onload',initData);//IE
                document.body.addEventListener('load',initData);//DOM
                function initData(){ ... }
                此語法能夠爲一個元素綁定多個監聽函數，但須要注意瀏覽器兼容性問題。

    一般瀏覽器在事件傳遞並處理完後可能會執行與該事件關聯的默認動做。例如：
        若是表單中input type屬性是submit時，點擊後會自動提交表單。
        input元素的keydown事件發生並處理後，瀏覽器默認會將用戶鍵入的字符自動追加到input元素的值中。...
    可採用下述方法阻止事件的默認行爲：
        event.returnValue = false;//IE
        event.preventDefault();//DOM

    事件週期：
        解釋器建立一個event對象後，會按以下過程將其在HTML元素間進行傳播：
            第一階段：事件捕獲，事件對象沿DOM樹向下傳播。
            第二階段：目標觸發，運行事件監聽函數。
            第三階段：事件冒泡，事件沿DOM樹向上傳播。
                IE的事件模型中沒有「事件捕獲」階段。

    事件的處理機制。
        當處於DHTML對象模型底部對象事件發生時會依次激活上面對象定義的同類事件處理。若不但願事件繼續向上/下傳遞，能夠取消冒泡（IE）或中止傳播（DOM）。
            event.cancelBubble = true;//IE
            event.stopPropagation();//DOM

= = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = =

Event對象：
    任何事件觸發後將會產生一個event對象。

    event對象記錄事件發生時的鼠標位置、鍵盤按鍵狀態和觸發對象等信息，事件對象的經常使用屬性：
        srcElement/target：事件源對象；
        eventPhase：事件所處的傳播階段
        clientX/offsetX/pageX/screenX/x：事件發生的X座標。
        clientY/offsetY/pageY/screenY/y：事件發生的Y座標。
        which/keyCode/charCode：鍵盤事件中按下的按鍵
        button：鼠標哪一個按鍵被按下了。
        cancelBubble：是否取消事件冒泡。
        returnValue：是否阻止了事件默認行爲。

        PS：event對象的全部屬性列表能夠在瀏覽器控制檯中輸出查看。

    獲取event對象。
        IE瀏覽器：js或者html代碼中直接使用event關鍵字。
        Firefox瀏覽器：html代碼中能夠直接使用event關鍵字。
            js代碼中不能直接使用event關鍵字。
            在HTML代碼中，在事件句柄定義時，使用event關鍵字將事件對象做爲參數傳入方法。
   
    使用event對象：
        對於event對象，常常須要得到事件源（觸發事件的元素，事件的目標節點）。
        IE瀏覽器：event.srcElement; Firefox瀏覽器：event.target ;

= = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = =

event對象 附錄：
    事件句柄：
                  事件發生在什麼時候：
        onabort 圖像的加載被中斷。
        onblur 元素失去焦點。
        onchange 域的內容被改變。
        onclick 當用戶點擊某個對象時調用的事件句柄。
        ondblclick 當用戶雙擊某個對象時調用的事件句柄。
        onerror 在加載文檔或圖像時發生錯誤。
        onfocus 元素得到焦點。
        onkeydown 某個鍵盤按鍵被按下。
        onkeypress 某個鍵盤按鍵被按下並鬆開。
        onkeyup 某個鍵盤按鍵被鬆開。
        onload 一張頁面或一幅圖像完成加載。
        onmousedown 鼠標按鈕被按下。
        onmousemove 鼠標被移動。
        onmouseout 鼠標從某元素移開。
        onmouseover 鼠標移到某元素之上。
        onmouseup 鼠標按鍵被鬆開。
        onreset 重置按鈕被點擊。
        onresize 窗口或框架被從新調整大小。
        onselect 文本被選中。
        onsubmit 確認按鈕被點擊。
        onunload 用戶退出頁面。

   鼠標 / 鍵盤屬性：
        altKey 返回當事件被觸發時，"ALT" 是否被按下。
        button 返回當事件被觸發時，哪一個鼠標按鈕被點擊。
        clientX 返回當事件被觸發時，鼠標指針的水平座標。
        clientY 返回當事件被觸發時，鼠標指針的垂直座標。
        ctrlKey 返回當事件被觸發時，"CTRL" 鍵是否被按下。
        metaKey 返回當事件被觸發時，"meta" 鍵是否被按下。
        relatedTarget 返回與事件的目標節點相關的節點。
        screenX 返回當某個事件被觸發時，鼠標指針的水平座標。
        screenY 返回當某個事件被觸發時，鼠標指針的垂直座標。
        shiftKey 返回當事件被觸發時，"SHIFT" 鍵是否被按下。

    IE 屬性
        除了上面的鼠標/事件屬性，IE 瀏覽器還支持下面的屬性：
        cancelBubble 若是事件句柄想阻止事件傳播到包容對象，必須把該屬性設爲 true。
        fromElement 對於 mouseover 和 mouseout 事件，fromElement 引用移出鼠標的元素。
        keyCode 對於 keypress 事件，該屬性聲明瞭被敲擊的鍵生成的 Unicode 字符碼。對於 keydown 和 keyup 事件，它指定了被敲擊的鍵的虛擬鍵盤碼。虛擬鍵盤碼可能和使用的鍵盤的佈局相關。
        offsetX,offsetY 發生事件的地點在事件源元素的座標系統中的 x 座標和 y 座標。
        returnValue 若是設置了該屬性，它的值比事件句柄的返回值優先級高。把這個屬性設置爲 fasle，能夠取消發生事件的源元素的默認動做。
        srcElement 對於生成事件的 Window 對象、Document 對象或 Element 對象的引用。
        toElement 對於 mouseover 和 mouseout 事件，該屬性引用移入鼠標的元素。
        x,y 事件發生的位置的 x 座標和 y 座標，它們相對於用CSS動態定位的最內層包容元素。

    標準 Event 屬性
        下面列出了 2 級 DOM 事件標準定義的屬性。
        bubbles 返回布爾值，指示事件是不是起泡事件類型。
        cancelable 返回布爾值，指示事件是否可擁可取消的默認動做。
        currentTarget 返回其事件監聽器觸發該事件的元素。
        eventPhase 返回事件傳播的當前階段。
        target 返回觸發此事件的元素（事件的目標節點）。
        timeStamp 返回事件生成的日期和時間。
        type 返回當前 Event 對象表示的事件的名稱。

    標準 Event 方法
        下面列出了 2 級 DOM 事件標準定義的方法。IE 的事件模型不支持這些方法：
        initEvent() 初始化新建立的 Event 對象的屬性。
        preventDefault() 通知瀏覽器不要執行與事件關聯的默認動做。
        stopPropagation() 再也不派發事件。