HTML文档最简结构必须包含哪些标签
一个能被浏览器正常解析的HTML文档，最低限度需要 、、<title></title> 和 四个标签。缺 <title></title> 浏览器不会报错，但 SEO 和可访问性会受损；缺 或 ，浏览器会自动补全，但 DOM 结构不可控，JS 获取 document.body 可能短暂为 null。
-
是根元素，必须有且仅有一个，建议加lang属性（如） -
里至少要有<title></title>；其他如<meta charset="UTF-8">强烈建议显式声明，否则可能触发怪异模式或乱码 -
是内容容器，所有可见节点都该在它里面；空合法，但实际项目中几乎不会这么用
为什么 不算“HTML元素”却必不可少
<doctype html></doctype> 不是 HTML 标签，而是文档类型声明（DTD），作用是告诉浏览器：“用标准模式渲染，别退回怪异模式”。没有它，IE 和旧版 Edge 会触发 Quirks Mode，导致盒模型、display 行为、甚至 JS 的 getBoundingClientRect() 计算都出偏差。
- 必须写在第一行，前面不能有任何字符（包括空格、BOM、注释）
- 大小写不敏感，但惯例全大写
<doctype html></doctype>；写成也合法 - 不要写成 XHTML 风格（如
..>），那是过时的写法
常见的“看似完整实则危险”的HTML结构
很多模板或生成工具输出的 HTML 看似闭合良好，但隐含兼容性或语义问题：
- 只写
没写lang属性：屏幕阅读器无法正确切换语音，多语言站点尤其要注意 -
里漏掉<meta name="viewport">：移动端页面默认缩放异常，文字小得看不清 - 把脚本直接写在
顶部且没加defer或async：阻塞 HTML 解析，首屏延迟明显 - 用
<div id="app"> 替代 <code><main></main>等语义化标签：对 SEO 和辅助技术不友好，不是错误，但属于可避免的技术债script 和 link 标签的位置影响远不止加载顺序
<script></script>放还是前，不只是“快慢”问题，更关系到 DOM 可用性和执行时机：立即学习“前端免费学习笔记（深入）”；
- 放在
的同步脚本，会等它执行完才继续解析后续 HTML，此时document.body为null - 放在
前的脚本，能确保document.body已存在，适合操作 DOM 的初始化逻辑 -
<link rel="stylesheet">放在是必须的；若误放中，会导致 FOUC（Flash of Unstyled Content） - 现代项目常用
<script type="module"></script>，它默认defer行为，且需注意模块路径必须是相对或绝对 URL，不能是 bare specifier
真正容易被忽略的是：HTML 解析是流式的，浏览器边下载边构建 DOM 树。所谓“结构”，不是静态快照，而是解析过程中的状态机。写错位置的标签，可能在开发时看不出问题，上线后在低端设备或弱网下才暴露渲染卡顿或 JS 执行失败。
- 放在
