JavaScript 语言最初是为 Web 浏览器创建的。此后,它已经演变成了一种具有多种用途和平台的语言。

JS 在浏览器运行时的鸟瞰示意图:

全局对象:

  • 浏览器:windowselfframesthis
  • Node.js:global
  • WebWorker:self
  • 标准通用:globalThis

文档对象模型(DOM)

文档对象模型(Document Object Model)是页面内容(HTML)的 JS 接口,document 对象是其“入口点”

DOM 规范:DOM Living Standard

DOM 不仅仅用于浏览器

DOM 规范解释了文档的结构,并提供了操作文档的对象。

一般由浏览器提供,但是有的非浏览器设备也使用 DOM。

例如,下载 HTML 文件并对其进行处理的服务器端脚本也可以使用 DOM。但它们可能仅支持部分规范中的内容。

用于样式的 CSSOM

另外也有一份针对 CSS 规则和样式表的、单独的规范 CSS Object Model (CSSOM),这份规范解释了如何将 CSS 表示为对象,以及如何读写这些对象。

当修改文档的样式规则时,CSSOM 与 DOM 是一起使用的。但实际上,很少需要 CSSOM,因为很少需要从 JavaScript 中修改 CSS 规则(通常只是添加/移除一些 CSS 类,而不是直接修改其中的 CSS 规则),但这也是可行的。

比如微前端处理样式隔离,CSSOM(CSS 的的 JS 接口)或许会提供帮助。

浏览器对象模型(BOM)

浏览器对象模型(Browser Object Model)表示由浏览器(主机环境)提供的用于处理文档(document)之外的所有内容的其他对象。

例如:

  • navigator 对象提供了有关浏览器和操作系统的背景信息。
    • navigator.userAgent:关于当前浏览器
    • navigator.platform:关于平台
  • location 对象提供了 URL 相关操作
  • alert/confirm/prompt:它们与文档(document)没有直接关系,代表了与用户通信的纯浏览器方法

规范

BOM 是通用 HTML 规范 的一部分。

在 https://html.spec.whatwg.org 中的 HTML 规范不仅是关于“HTML 语言”(标签,特性)的,还涵盖了一堆对象、方法和浏览器特定的 DOM 扩展。这就是“广义的 HTML”。此外,某些部分也有其他的规范,它们被列在 https://spec.whatwg.org 中。