IE条件注释仅在IE5–IE9中有效,语法必须严格匹配:<!--[if lt IE 9]>(中括号内外零空格、IE大写、关键词小写且与版本号间各一空格),错误即失效;IE10+及Edge完全不支持;仅限HTML内使用,现代项目应弃用。

IE条件注释的语法必须严格匹配,空格错一位就失效
IE条件注释不是普通HTML注释,它是一套被IE(仅IE5–IE9)识别的专有解析机制。浏览器在解析时会逐字符校验格式,任何多余或缺失的空格都会导致整个条件块被当作普通注释忽略——html5shiv.js 和 respond.js 就因此静默失效。
常见错误写法及后果:
-
<!--[if lt ie 9]>→ 中括号前多一个空格:IE完全不执行内部脚本 -
<!--[if lt ie9]>→ie和9之间没空格:条件不匹配,IE8照样跳过 -
<!-- [if lt ie 9]>→ 中括号后紧贴空格:部分IE版本直接丢弃整段
正确格式只有一种:<!--[if lt IE 9]>(注意:IE必须大写,lt和IE间一个空格,IE和9间一个空格,中括号内外**零空格**)
支持的条件关键词只有 lt、lte、gt、gte、!,不能拼错或混用
IE条件注释不支持自定义逻辑或JavaScript表达式,只认固定关键词。写错一个字母,比如把 lte 写成 let 或 less than,整个条件就变成普通注释。
立即学习“前端免费学习笔记(深入)”;
常用组合(全部区分大小写,且必须小写关键词 + 大写IE):
-
<!--[if lt IE 9]>→ 仅IE8及以下 -
<!--[if lte IE 7]>→ IE7及以下(lte是“less than or equal”) -
<!--[if !IE]>→ 非IE浏览器(注意感叹号后无空格) -
<!--[if gt IE 8]>→ IE9及以上(实际已不触发,因IE10+默认禁用条件注释)
特别注意:IE 10+ 完全不支持条件注释,即使语法正确也无效;Edge 从初始版本起就彻底移除该特性。
条件注释只能用于HTML,不能塞进CSS或JS文件里
条件注释是HTML解析器层面的特性,只在HTML文档中生效。把它复制进 style.css 或 main.js 文件里,等同于写了一行普通注释——浏览器压根不会识别,更不会按条件加载资源。
典型误用场景:
- 在CSS文件里写
/* <!--[if IE]> .box { zoom: 1; } <![endif]--> */→ 无效 - 在JS中用字符串拼接生成条件注释并 innerHTML 插入 → DOM解析时已过期,不触发
- 用构建工具(如Webpack)把条件注释当变量注入HTML模板但未保留原始格式 → 空格被压缩,失效
唯一安全位置:直接写在HTML源码的 <head> 或 <body> 内,且确保构建流程不触碰这些行(例如配置HTML插件跳过条件注释区域)。
现代项目中该不该继续用条件注释
答案很明确:除非你还在维护必须兼容IE8的政企内网系统,否则别用。IE8全球市场份额已低于0.01%,且微软早在2016年就终止所有IE8支持。
继续使用的隐性成本:
- 增加HTML体积,哪怕只是几行注释,也会拖慢首屏解析
- 干扰现代工具链(如Prettier、ESLint、Lighthouse),报“unknown directive”警告
- 误导新人以为这是标准HTML语法,引发后续维护混乱
-
html5shiv.js本身存在DOM污染风险,在复杂SPA中可能与Vue/React的挂载逻辑冲突
真正该关注的,是用 @supports 查询替代CSS hack,用 Promise / fetch 特性检测替代JS polyfill硬加载——条件注释,本质上是个该进博物馆的IE时代遗物。



















