<p>HTML5注释语法仍为<!-- -->,未新增功能;禁止注释内含--或以-结尾;条件注释已失效;script/style内须用对应语言注释;不支持嵌套;位置与特殊字符需谨慎。</p>

HTML5 注释语法和旧版完全一致
HTML5 没有修改注释语法,<!-- --> 仍然是唯一合法的注释方式,和 HTML4、XHTML 一模一样。所谓“HTML5 注释特性”,其实是对已有语法更明确的规范约束,不是新增功能。
- 浏览器解析时,
<!--到-->之间的所有内容(包括换行、标签、JS 代码)一律跳过,不进入 DOM,也不执行 - W3C 在 HTML5 规范中特别强调:禁止在注释里出现
--连续序列或以-结尾,否则会提前终止注释,导致后续 HTML 被误判为注释内容 - 例如
<!-- 配置项:--debug -->是危险写法,第二个--会让浏览器认为注释已在debug后结束,后面的内容可能被暴露或破坏结构
条件注释在 HTML5 中已彻底失效
IE 专属的 <!--[if IE]>...<![endif]--> 不是标准 HTML 注释,而是 IE 私有解析机制。从 IE10 开始就被移除,HTML5 规范也从未接纳它。
- 现代浏览器(Chrome/Firefox/Safari/Edge)遇到条件注释,只当普通注释处理,里面的内容永远不渲染
- 如果你在新项目里还看到这类写法,基本说明代码没更新,或在维护遗留系统
- 替代方案不是“改注释”,而是用特性检测(如
if ('querySelector' in document))或 CSS @supports
别在 <script> 或 <style> 里用 HTML 注释包裹代码
这是新手高频误用点:以为 <!-- ... --> 能让 JS/CSS 安全“隐身”,其实它只是把代码变成一段被忽略的字符串,既不执行,也不参与语法解析。
- 在
<script>内部,必须用 JS 注释://或/* */;<!--只是历史兼容写法,用于欺骗老式浏览器(如 Netscape 1.x),现在毫无必要 - 在
<style>内部,必须用 CSS 注释:/* */;HTML 注释在这里不会报错,但会被当成无效字符,可能干扰 CSS 解析器 - 错误示例:
<script><!-- console.log('hello'); --></script>→ 控制台不会输出,且现代 Linter 会警告
编辑器快捷键和注释嵌套的现实限制
VS Code、Sublime 等编辑器的 Ctrl+Shift+/ 快捷键确实能快速注释选中代码,但它生成的是标准 <!-- -->,不能解决嵌套问题——HTML 注释本身不支持嵌套。
立即学习“前端免费学习笔记(深入)”;
- 写成
<!-- <!-- 内层 --> 外层 -->会导致第一个-->就关闭注释,后面内容暴露 - 如果真需要多层说明,只能分段写:
<!-- 开始 A 模块 -->...<!-- 结束 A 模块 --> - 注释位置很关键:不能放在
<!DOCTYPE html>前(触发怪异模式),也不能紧贴自闭合标签后影响语义(如<img src="x"><!-- 注释 -->没问题,但<img src="x" /><!-- 注释 -->的斜杠写法在 HTML5 中本就不推荐)
真正容易被忽略的,是注释里的特殊字符边界 —— 它不像 JS 或 CSS 那样有容错空间,一个不小心的 -- 就能让整页布局错乱,而开发者工具里往往只看到“空白”或“意外闭合”,很难直接联想到注释语法问题。











