html注释必须用且不可含--或>,禁止嵌套,否则提前终止导致解析异常;script/style内无需html注释,现代浏览器原生支持。
html 注释不会被浏览器渲染,也不会影响页面行为,但写错位置或嵌套会直接导致解析异常——最常见的是注释意外吞掉后续标签。
HTML 注释的正确写法和位置限制
HTML 注释只能用 <!-- -->,开头必须是 <!--,结尾必须是 -->,中间不能出现 -- 或 >。注释可以放在任意标签内外(包括 、、标签之间、甚至属性值里——但不推荐)。
- ✅ 正确:
<!-- 这是一个合法注释 --> - ❌ 错误:
<!-- 这里用了--双横线 -->(--出现在中间) - ❌ 错误:
<!-- 注释里写了 > 字符 -->(>会提前结束注释) - ⚠️ 危险:
<div class="<!-- 注释 -->box">(注释在属性值内,多数浏览器会解析失败或截断)<h3>为什么不能嵌套 HTML 注释</h3> <p>HTML 解析器遇到第一个 <code>-->就立刻关闭注释,不管后面还有没有<!--。所谓“嵌套”实际是提前终止 + 后续乱码,极易导致结构错乱。- ❌ 错误写法:
<!-- 外层<!-- 内层 -->内容 --> - → 实际效果:解析器在
<!-- 内层 -->就结束了注释,剩下内容 -->被当成普通文本显示 - ? 替代方案:需要多段隔离,就分开写多个独立注释,比如:
<!-- 第一段 --><!-- 第二段 --> - ? 不要再用:
<script><!-- alert(1); //--></script> - ✅ 推荐写法:
<script>alert(1);</script>,JS 内部用//或/* */ - ⚠️ 特殊情况:如果 JS 代码里含
字符串(如模板字符串),需转义或拆分,而不是靠外层 HTML 注释兜底
在 script/style 标签里要不要加 HTML 注释
老式写法(如
<script><!-- ... //--></script>)是为了兼容 Netscape 2/IE 3 等已淘汰浏览器,现代所有浏览器都支持原生<script></script>和<style></style>,加 HTML 注释反而可能引发问题。最容易被忽略的是注释里混入未转义的 HTML 特殊字符,比如
<!-- <div> -->—— 这个<div> 不会被解析为标签,但若后续紧跟真实 <code><div>,解析器可能因状态混乱而跳过闭合。写注释时,把它当纯文本对待,别“顺手”写结构。<p><span>立即学习</span>“<a href="https://pan.quark.cn/s/cb6835dc7db1" style="text-decoration: underline !important; color: blue; font-weight: bolder;" rel="nofollow" target="_blank">前端免费学习笔记(深入)</a>”;</p> </div> - ❌ 错误写法:









