HTML注释必须用，其他如//、/ /、#或---均无效，会被浏览器当作普通文本渲染；注释中禁用--和-->，需用中文破折号“—”替代；&必须写为&；JS/CSS内不可用HTML注释；注释须完整包裹标签对，避免DOM错乱；构建工具可自动移除注释，但含模板语法的注释仍可能被执行。
HTML注释必须用<!-- --> ，别试其他写法
HTML 没有 //、/* */、# 或三连短横 <!--- 这类语法。任何非 <!-- --> 的写法都会被浏览器当作普通文本渲染出来，轻则页面上显示“<!-- 注释 -->”，重则破坏 DOM 结构导致空白页或错位。
-
<!-- 这是唯一合法形式 -->✅ -
// 这不是注释❌（会直接显示在页面上） -
/* 也不是 */❌（同上） -
<!--- 多一个横线就卡住解析 -->❌（部分解析器会停在<!---后不再继续）
VS Code 快捷键 Ctrl+/ 是否生效，取决于右下角语言模式是否为 html。如果当前是 javascript 或 plaintext 模式，它会插 // 或 #，而不是 <!-- --> 。
注释里不能出现 -- 或 -->，否则提前闭合
HTML 解析器只要在 <!-- 后看到连续两个短横 --，就会立刻终止注释——不管后面有没有 -->。这不是编辑器高亮问题，是真实解析行为。
-
<!-- 版本号 v2.1--beta -->❌（--beta中的--触发提前闭合） -
<!-- 版本号 v2.1—beta -->✅（用中文长破折号—替代） -
<!-- 链接地址: https://example.com/path?x=1&y=2 -->✅（&是必须转义的） -
<!-- 这里写了 > 符号 -->❌（>单独出现没事，但若前面紧挨着--，如-->，就会被识别为结束标记）
常见后果：注释后紧跟的 <div> 消失、<code><script></script> 不执行、控制台报 Uncaught SyntaxError: Unexpected token '('——其实只是注释没闭合，JS 被当作文本流的一部分了。
立即学习“前端免费学习笔记（深入）”；
<script></script> 和 <style></style> 标签内部不要加 HTML 注释
HTML 注释只对 HTML 解析器有效，JS 引擎和 CSS 解析器完全无视它。在 <script></script> 里写 <!-- 不是注释 JS，而是告诉 HTML 解析器：“从这儿开始一段注释”，结果 JS 代码裸露在注释体外，可能被当作文本渲染或触发语法错误。
<script><!-- console.log("test"); -->❌（HTML 解析器认为注释从<!--开始但没闭合，console.log被当作文本）<script>// console.log("test");</script>✅（JS 注释）<script>/* console.log("test"); */</script>✅（JS 注释）<style><!-- body { color: red } -->❌（CSS 不认<!--，整段失效甚至报错）<style>/* body { color: red } */</style>✅（CSS 注释）
过去那种 <script><!-- ... //--> 是为 Netscape 2 / IE3 做的兼容，现代浏览器已完全废弃。留着反而增加出错概率。
临时屏蔽代码时，用 <!-- 包裹整块 HTML，别只包标签
想临时禁用一段结构，最安全的做法是把整个块（包括起始标签、内容、闭合标签）一起用 <!-- --> 包起来。只注释开标签或只注释闭标签，会导致 HTML 解析状态混乱，DOM 树错乱。
-
<!-- <header><nav>...</nav></header> -->✅（完整包裹，安全） -
<!-- <header> --><nav>...</nav>❌（<header></header>被注释，却还在，父容器丢失） -
<header><!-- <nav>...</nav> --></header>✅（仅注释子内容，不影响结构）
构建工具（如 Webpack + html-webpack-plugin）常配 minify: { removeComments: true } 上线前自动剔除注释。但要注意：如果注释里混了模板语法（如 <!-- {{ user.name }} -->），某些服务端模板引擎（Django/EJS）仍会执行其中逻辑——它只是“看起来像注释”，实际参与了渲染流程。
