有条件的评论！IE旧版本的Firefox中断

Question

我遇到的情况是我需要根据浏览器访问页面加载两个样式表中的一个：
如果除了IE之外什么都可以加载“新”样式表
如果IE＆gt; = 9则加载“新”样式表
如果IE＆lt; 9然后加载旧样式表

这是用于实现该目的的代码：

<!--[if lt IE 9]>
<link type="text/css" rel="stylesheet" href="/stylesheets/old.css">
<![endif]-->
<!--[if gte IE 9]>
<link type="text/css" rel="stylesheet" href="/stylesheets/new.css">
<!--<![endif]-->
<!--[if !IE]><!-->
<link type="text/css" rel="stylesheet" href="/stylesheets/new.css">
<!--<![endif]-->

这适用于所有现代浏览器，旧版本的IE正确加载旧样式。但是，在旧版本的Firefox（3.6）和其他可能的版本中，未加载新的css，而是将-->打印到网页上。这是因为声明的行！IE - <!-->必须添加，否则IE 11不会加载样式表。如果我把它拿出来它在Firefox 3.6中正常工作。

设置这些条件注释以确保它适用于各种浏览器和版本的正确方法是什么？

Answer 1

我认为问题在于<!--分隔符之一，特别是IE9条件语句中的分隔符恰好在其对应的<![endif]-->之前。 <!--[if gte IE 9]>评论尚未终止，因此在那里设置另一个<!--分隔符实际上无效，因为无法在HTML中嵌套评论。虽然当前版本的Firefox表现如预期，但如果这是Firefox 3.6以不同方式处理它的原因，我也不会感到惊讶。

如果你摆脱它，Firefox 3.6的行为正确：

<!--[if lt IE 9]>
<link type="text/css" rel="stylesheet" href="/stylesheets/old.css">
<![endif]-->
<!--[if gte IE 9]>
<link type="text/css" rel="stylesheet" href="/stylesheets/new.css">
<![endif]-->
<!--[if !IE]><!-->
<link type="text/css" rel="stylesheet" href="/stylesheets/new.css">
<!--<![endif]-->

事实上，你可以通过给你的IE9条件语句<!-->处理来使你的代码更加干燥，如下所示：

<!--[if lt IE 9]>
<link type="text/css" rel="stylesheet" href="/stylesheets/old.css">
<![endif]-->
<!--[if gte IE 9]><!-->
<link type="text/css" rel="stylesheet" href="/stylesheets/new.css">
<!--<![endif]-->

这样就完全消除了对“新”样式表的额外引用，同时仍然允许所有浏览器以及IE9访问它。请注意，超过9的其他IE版本实际上不再支持条件注释，因此您可以进一步将gte IE 9更改为IE 9，它仍可用于较新版本的IE（以及其他浏览器） ）。当然，为了清楚起见，欢迎您保持这种方式。

在旁注中，虽然我说在评论中包含<!--序列无效，但<!-->被解释为<!，后跟结束分隔符{{1而不是-->后跟<!--，这就是为什么这个位没问题。