HTML注释必须用，其他语法无效且可能显示；不可嵌套、禁用--连写；注释是DOM中真实Comment节点，影响选择器匹配；不执行但暴露源码，勿存敏感信息；建议用TODO/FIXME等前缀规范用途。
HTML 注释写法必须用 <!-- -->，别手滑写成 // 或 /* */
浏览器只认 <!-- --> 这一套注释语法，其他语言的注释风格在 HTML 里完全无效，也不会被忽略——有些甚至会直接显示在页面上。比如你在 里写了 // 这是注释，它可能就真出现在标题栏下方。
<!-- 这样是对的 -->-
<!-- 多行也OK -->（不需要每行都加<!--和-->） - 不能嵌套：
<!-- <!-- 内层 --> 外层 -->会导致外层注释提前结束 - 注释里不能出现
--连写（如<!-- 值为--10 -->），否则解析器会在第一个--后截断
HTML 注释位置影响 DOM 解析，但不参与渲染或执行
注释节点会作为 Comment 类型真实存在于 DOM 树中，document.body.childNodes 里能数出来。这意味着：用 querySelector 选元素时，:nth-child(2) 可能选到的是注释而不是你想要的 <div>；用 <code>element.children 则自动过滤掉注释，但 element.childNodes 不会。
- 调试时用
console.dir(element.childNodes)比console.log(element)更容易发现“多出来的空白节点”其实是注释 - 服务端模板（如 EJS、Django）生成 HTML 时，如果条件块里留了注释，可能意外让注释出现在不该出现的位置（比如
<table> 内部中间）<li>不要依赖注释来“临时禁用”一段 HTML 结构——它还在 DOM 里，只是不显示；真要移除，得删掉或用 JS 控制 <code>display: none - 注释内容对用户完全可见（查看源码就能看到），别把密钥、内部路径、未上线功能说明写进去
- 某些构建工具（如 Webpack 的
html-webpack-plugin）默认保留注释；上线前若没配置minify.removeComments: true，生产环境照样泄露 - 注释里写
<!-- {{ variable }} -->对服务端模板有效，但对纯静态 HTML 无效——它就是字面量，不会被二次解释 - 用统一前缀便于 grep：
grep -n "<!-- FIXME" *.html - 避免空泛描述，比如
<!-- 这里有问题 -->，不如写<!-- FIXME: Safari 下 flex gap 不生效 --> - 团队内约定好前缀（
TODO/FIXME/HACK）比起个“汇总”文件名更管用
HTML 注释里的引号、尖括号、脚本片段不会被解析执行
这是安全边界：哪怕你写 <!-- <script>alert(1)</script> -->，这段内容纯文本存着，不会触发 JS 执行，也不会被 HTML 解析器当成标签处理。但要注意——这只是“不执行”，不是“不暴露”。
「HTML代码引文注释汇总」这类命名习惯容易混淆语义
所谓“引文注释”，并不是 HTML 标准里的概念，而是人自己加的分类标签。实际使用中，更关键的是区分用途：<!-- TODO: 接口未联调 --> 是开发标记，<!-- IE8 兼容 hack --> 是兼容性说明，<!-- Analytics pixel --> 是第三方代码标识。混用一个汇总名，反而让搜索和维护变难。
立即学习“前端免费学习笔记（深入）”；
事情说清了就结束。注释本身很简单，但混进模板、构建链路、协作习惯之后，最容易出问题的反而是“以为它无害”那一部分。
