有关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() 不再派发事件。