DOM树结构与节点类型解析

DOM树是浏览器将HTML文档解析后构建的层级节点结构，以Document为根（nodeType=9），元素、文本、注释等各类内容分别对应Element（1）、Text（3）、Comment（8）等不同类型的Node实例，它们通过parentNode、childNodes、children等属性形成父子与兄弟关系；理解nodeType这一核心判别依据、区分childNodes与children的本质差异、规避空白文本节点陷阱，是高效安全操作DOM的关键——掌握这些底层逻辑，才能真正摆脱“获取不到元素”“innerHTML报错”等常见困扰，写出健壮可靠的前端代码。

DOM树本质上是浏览器将HTML文档解析后生成的一棵节点树，每个节点都是Node对象的实例，而不同类型的节点（如元素、文本、注释等）通过nodeType属性区分，并在树中按父子、兄弟关系组织成层级结构。

DOM树的核心层次：Document → Element → Content

整棵DOM树以document为根节点，它是Document类型节点（nodeType === 9）。所有HTML元素（如