DOM（文档对象模型）

从 HTML 到节点树

浏览器拿到 HTML 字节流后，经词法分析与语法分析生成一棵以 Document 为根的节点树。每个元素、文本片段、注释都是树上的一个节点（Node），继承自不同的接口：Element、Text、Comment 等。开发者通过 document.getElementById、querySelector 等 API 拿到节点引用，再调用 appendChild、remove、setAttribute 等方法改变文档结构。每次结构变动都可能触发浏览器的 重排（Reflow） 和 重绘（Repaint），这也是性能优化的核心战场。[1]

标准演进与现代用法

W3C 于 1998 年发布 DOM Level 1，奠定节点遍历基础；DOM Level 2（2000 年）引入事件模型与 CSS 操作；DOM Level 3 完善了键盘事件与文档加载。此后规范迁移到 WHATWG 的 Living Standard 持续迭代，不再有整数版本号。现代浏览器全面支持 querySelectorAll（2009 年起稳定）、closest、dataset 等便捷 API，jQuery 曾经包揽的选择器任务已基本被原生取代。虚拟 DOM（React、Vue 的差异化更新方案）并不是浏览器标准，而是框架在真实 DOM 之上建立的映射层，目的是批量计算最小变更集，减少昂贵的真实 DOM 操作次数。