关于javascript组成DOM和BOM的一点认识

绝地灬酷狼 2022-04-08 13:24 138阅读 0赞

> **javaScript的实现包括以下3个部分：**
> 
> <table> 
>  <tbody> 
>   <tr> 
>    <td style="vertical-align:top;"> <p>ECMAScript(核心)</p> </td> 
>    <td style="vertical-align:top;"> <p>描述了JS的语法和基本对象。</p> </td> 
>   </tr> 
>   <tr> 
>    <td style="vertical-align:top;"> <p>文档对象模型 （DOM）</p> </td> 
>    <td style="vertical-align:top;"> <p>处理网页内容的方法和接口</p> </td> 
>   </tr> 
>   <tr> 
>    <td style="vertical-align:top;"> <p>浏览器对象模型（BOM）</p> </td> 
>    <td style="vertical-align:top;"> <p>与浏览器交互的方法和接口</p> </td> 
>   </tr> 
>  </tbody> 
> </table>

> **关于DOM、BOM的一点介绍：**
> 
>  *   DOM 是 W3C 的标准； \[所有浏览器公共遵守的标准\]
>  *  BOM 是 各个浏览器厂商根据 DOM在各自浏览器上的实现;\[表现为不同浏览器定义有差别,实现方式不同\]
>  *   window 是 BOM 对象，而非 js 对象；javacsript是通过访问BOM（Browser Object Model）对象来访问、控制、修改客户端(浏览器)

> **DOM详解： （Document Object Model）**
> 
>  *  DOM 是 W3C（万维网联盟）的标准。
>  *  DOM 定义了访问 HTML 和 XML 文档的标准：
> 
> “W3C 文档对象模型 （DOM） 是中立于平台和语言的接口，它允许程序和脚本动态地访问和更新文档的内容、结构和样式。”  
> W3C DOM 标准被分为 3 个不同的部分：
> 
>  *  核心 DOM - 针对任何结构化文档的标准模型
>  *  XML DOM - 针对 XML 文档的标准模型
>  *  HTML DOM - 针对 HTML 文档的标准模型

>  **HTML DOM 是：** 
> 
>  ![HTML DOM Node Tree][]
> 
>  *  HTML 的标准对象模型
>  *  HTML 的标准编程接口
>  *  W3C 标准
>  *  HTML DOM 定义了所有 HTML 元素的*对象*和*属性*，以及访问它们的*方法*。
>     
>     *换言之，HTML DOM 是关于如何获取、修改、添加或删除 HTML 元素的标准。（**操作节点以及对节点属性操作**）*
>  *  HTML DOM树如下

> ** BOM详解：（Browser Object Model）**
> 
> `BOM`的核心是`window`，而`window`对象又具有双重角色，它既是通过js访问浏览器窗口的一个接口，又是一个`Global`（全局）对象。这意味着在网页中定义的任何对象，变量和函数，都以window作为其`global`对象（window.document，window.location，window.navigator，window.screen）。
> 
> **通常浏览器特定的JavaScript 扩展都被看做 BOM 的一部分。这些扩展包括：**
> 
>  *  弹出新的浏览器窗口
>  *  移动、关闭浏览器窗口以及调整窗口大小
>  *  提供 Web 浏览器详细信息的定位对象
>  *  提供用户屏幕分辨率详细信息的屏幕对象
>  *  对 cookie 的支持
>  *  IE 扩展了 BOM，加入了 ActiveXObject 类，可以通过 JavaScript 实例化 ActiveX 对象

[HTML DOM Node Tree]: /images/20220405/1e5e8921be1a43579769ab3142168463.png