一个html文档必须且只能有一对标签，它是整个文档的根元素和解析起点；中不可放置可见内容，否则会被浏览器自动迁移或导致结构异常；所有用户可见内容必须严格置于内。
必须有且仅有一个，它不是可选的“包装容器”，而是浏览器解析整个文档的起点。没它， 和 就失去上下文，部分浏览器会降级到怪异模式，样式错乱、JS行为异常都可能由此触发。
为什么
浏览器在构建渲染树前，先解析 并执行其中的 <meta>、<title></title>、<link>、<script></script> 等指令——这些操作不产出像素，只做准备。把 <p></p> 或 <div> 塞进 <code>，HTML 解析器会自动将其“踢出”到 开头（或创建隐式 ），但这个修复不可靠，尤其在 SSR 或静态生成场景下容易导致 DOM 结构与预期不符。
-
<title></title>只影响标签页标题和 SEO，不参与布局 -
<meta charset="utf-8">必须早于任何文本内容，否则中文等非 ASCII 字符可能乱码 -
<script></script>放在里默认同步阻塞，建议加defer或移至前
严格来说，HTML 允许在 根标签下直接写文本或注释（比如 hello），但这些内容既不在 也不在 中，浏览器会忽略渲染，DOM 中也找不到对应节点。更危险的是：某些构建工具（如 Webpack + html-webpack-plugin）会把这类“游离内容”直接丢弃，导致上线后内容消失。
- 所有用户可见内容必须包裹在
内，哪怕只是空格或换行 -
<!-- 注释 -->在外或/外会被保留为文档注释，但不影响 DOM - 自闭合标签如
<img>、<br>不需要包裹，但必须出现在内部才有效
DOM 树的叶子节点不等于 HTML 的末级标签
所谓“叶子标签”，不是指嵌套最深的标签，而是指没有子节点的元素节点（如 <img src="x">、<br>、纯文本节点）。但注意：<strong>text</strong> 的叶子是文本节点，不是 <strong></strong>；<div><p>hi</p><div class="aritcle_card flexRow artxards">
<div class="artcardd flexRow">
<a class="aritcle_card_img" rel="nofollow" href="/xiazai/skill6712" title="Wechat HTML Publisher"><img
src="https://img.php.cn/upload/skill/000/000/081/179109368394970.jpg" alt="Wechat HTML Publisher" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a>
<div class="aritcle_card_info flexColumn">
<a rel="nofollow" href="/xiazai/skill6712" title="Wechat HTML Publisher" class="overflowclass">Wechat HTML Publisher</a>
<p class="overflowclass">直接上传HTML富文本到微信公众号草稿箱。支持完整的HTML格式,无需Markdown转换。</p>
</div>
<a rel="nofollow" href="/xiazai/skill6712" title="Wechat HTML Publisher" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span>
</a>
</div>
</div></div> 的叶子是 "hi"，不是 <p></p>。DOM 树真正闭环的判断依据是：每个元素都有明确父节点（除 ），且所有路径最终收敛到 —— 这个闭环不是靠“写满所有层级”实现的，而是靠解析器自动补全缺失结构（如自动闭合未结束的 <p></p>）和规范约束（如 与 互斥）。
- 浏览器容错机制会补全很多错误，但补全逻辑各引擎不同（WebKit / Blink / Gecko），别依赖它
- 用
document.documentElement获取，用document.body获取，它们永远存在，哪怕源码漏写了 - 验证结构是否合规，优先看浏览器开发者工具里的 Elements 面板，而不是肉眼数标签对
真正容易被忽略的，是 和 的边界语义——它们不是视觉分区，而是解析阶段的职责划分。写错位置的内容，可能“看起来正常”，但会在 SSR、SEO、无障碍访问中暴露问题。
