17370845950

XML DOM是通用数据模型，HTML DOM是其浏览器加强版；二者共享树形结构与基础API，但HTML DOM扩展了事件、样式、容错解析等Web特有功能。

XML的文档对象模型（DOM）是一种与平台和语言无关的编程接口，它把XML文档看作一棵节点树，每个元素、属性、文本甚至注释都表示为一个对象（即节点），程序可以通过这些对象读取、修改、添加或删除文档内容。

XML DOM 的核心特点

XML DOM 定义了一组标准的对象、属性和方法，用于访问和操作任意 XML 文档的结构化数据。它不关心文档用途，只关注语法结构：根元素、嵌套元素、属性、文本内容、命名空间等都被建模为不同类型的节点（如 Element、Attribute、Text、Document）。XML DOM 本身是中立的，不包含渲染、样式或用户交互逻辑。

HTML DOM 是 XML DOM 的特化扩展

HTML DOM 在本质上继承了 XML DOM 的树形结构和基本节点模型，但做了大量面向 Web 页面的增强：

• HTML 元素有预定义的行为（比如 click、submit 事件），XML DOM 没有内置事件系统
• HTML DOM 包含专有接口（如 HTMLDivElement、HTMLFormElement），提供表单提交、焦点控制、样式操作（style 属性）等能力
• 浏览器对 HTML 进行了容错解析（如自动补全 tbody、忽略大小写），而 XML DOM 要求严格符合语法，出错即报错
• HTML DOM 支持 CSS 选择器（querySelector）、动态渲染、布局计算（offsetHeight）等，这些在纯 XML DOM 中不可用

两者共用同一套基础 API

像 document.getElementById、element.getElementsByTagName、node.appendChild、node.getAttribute 这类基础方法，在 HTML 和 XML DOM 中名称和行为一致。这是因为 HTML DOM 规范明确基于 XML DOM 核心定义，并在其上叠加 Web 特性。现代浏览器内部也共享很多解析和节点管理逻辑。

立即学习“前端免费学习笔记（深入）”；

实际使用中的关键区别

如果你用 JavaScript 加载一个 XML 文件（例如通过 XMLHttpRequest 或 fetch），得到的是一个 XML DOM 文档对象，不能直接调用 innerHTML 或触发 click()；而 HTML 文档对象则默认支持这些。不过，你仍可用相同方式遍历节点、查找元素、提取属性值——只要不依赖 HTML 特有功能，代码往往可以复用。

基本上就这些。XML DOM 是通用数据模型，HTML DOM 是它的“浏览器加强版”。理解这个层次关系，有助于写出更清晰、可迁移的前端或数据处理代码。