Element 是 Node 的子类，体现泛化→特化关系；Node 是 DOM 所有节点的基类，定义通用属性方法；Element 继承并扩展元素专属能力，如 getAttribute、children 等；完整继承链为 EventTarget ← Node ← Element ← HTMLElement ← HTMLDivElement。
Element 是 Node 的子类，Node 是 DOM 节点的基类，整个继承链体现的是“泛化 → 特化”的层级关系。
Node 是所有节点的顶层接口
DOM 中一切可操作的对象（元素、文本、注释、文档、属性、片段等）都属于 Node 类型。它定义了通用能力，比如：
- parentNode、childNodes、nextSibling 等导航属性
- appendChild()、removeChild()、cloneNode() 等操作方法
- nodeType（数值标识类型，如 1 表示 ELEMENT_NODE，3 表示 TEXT_NODE）
- nodeName 和 nodeValue（不同节点类型表现不同，比如文本节点的 nodeValue 是内容，元素节点的 nodeValue 是 null）
Element 继承自 Node 并扩展专属能力
Element 不是独立于 Node 的并列类型，而是明确继承自 Node 的子接口。这意味着：
- 所有 Element 实例天然具备 Node 的全部属性和方法（例如可以调用 parentNode 或 removeChild()）
- Element 新增了只对“标签元素”有意义的方法，比如：getAttribute()、setAttribute()、classList、innerHTML
- Element 还进一步区分了导航行为：例如 children 只返回 Element 子节点（跳过文本/注释），而 childNodes 返回所有子 Node
- Element 实例的 nodeType 恒为 1，但 Node 实例的 nodeType 可能是 1、3、8、9 等
完整的继承链是：EventTarget ← Node ← Element ← HTMLElement ← HTMLDivElement 等
浏览器中具体元素（如 <div>）不是直接构造自 Element，而是由更具体的构造函数生成：
立即学习“Java免费学习笔记（深入）”；
-
document.querySelector('div')返回的是 HTMLDivElement 实例 - 它依次继承：HTMLDivElement → HTMLElement → Element → Node → EventTarget
- 所以一个 div 元素既能响应事件（来自 EventTarget），也能被遍历（来自 Node），还能操作 class（来自 Element），也能设置 style（来自 HTMLElement）
- 用 instanceof 判断时，
el instanceof Element和el instanceof Node同时为 true，但反过来不成立
实际判断与调试技巧
遇到 DOM 对象时，快速厘清类型可借助这些方式：
- 查 nodeType：值为 1 → 肯定是 Element；值为 3 → 文本节点（不是 Element）
- 查 tagName：Element 有该属性（如
'DIV'），Node 其他类型会返回undefined - 查 constructor.name：能看到具体构造函数名，比如
'HTMLParagraphElement' - 用 el.children.length vs el.childNodes.length 对比：若差值明显，说明存在大量空白文本节点（换行缩进导致）
