javascript - 如果满足

Question

我正在开发一个不支持 IE6 或 IE7 的 Javascript 驱动的交互工具。

如果有人使用旧版 IE，或者使用禁用了 Javascript 的浏览器，我们会为他们提供一些简单的静态内容作为后备:纯图像和文本。

我可以通过复制静态内容来做到这一点，一份在<noscript>中 block ，并在条件注释中复制一份，就像这样......

<!--[if lte IE 7]>
<div id="some-id">
<p> Some content </p>
<img src="url.com" alt="Screenshot of awesome tool" title="This is what you're missing" />
<p> Some more content </p>
<div id="some-more"> ... etc ... </div>
</div>
<![endif]-->

<noscript><![if !(lte IE 7)]> 
<div id="some-id">
<p> Some content </p>
<img src="url.com" alt="Screenshot of awesome tool" title="This is what you're missing" />
<p> Some more content </p>
<div id="some-more"> ... etc ... </div>
</div>
<![endif]></noscript>

...但如果可能的话，最好避免重复这样的内容。没有不必要的重量，更容易更新，没有任何搜索引擎机器人将隐藏的重复内容解释为关键字垃圾邮件等的风险。另外，避免重复只是一个普遍的好习惯。

(另外，我们可能会在 <![if !(lte IE7)]> 标签中丢失可怕的 <noscript>...如果有人使用禁用了 Javascript 的 IE6 或 IE7，那么他们就不会看到内容两次...我听说一些公司系统拥有与旧版 IE 绑定(bind)的遗留定制系统，这是一种让旧版 IE 稍微更安全的可怕方式...)

如果我将条件内容包装在 <noscript> 中，反之亦然，它将是“与”逻辑 - 仅在满足两个条件时显示(禁用 Javascript 的 IE6/7)。

有没有办法让它通过“或”逻辑工作 - 所以只有一个内容 block ，如果没有 Javascript，则显示一个内容 block ，OR 如果是 IE低于版本 7？ 或者使用 Javascript 切换 <noscript> 的一些聪明简单可靠的方法如果浏览器启用了 Javascript 并且是旧版本的 IE(理想情况下，无需等待文档就绪)？

因为我已经在使用条件注释，所以严格标准合规性不是什么大问题，例如如果有一种方法可以在 <noscript> 的属性中涉及脚本标签，这样就好了。 jQuery 语法也很好。

向旧 IE 或无脚本浏览器提供一个后备内容 block 的简单、干净的方法将是一件非常有用的事情。

Answer 1

我想我已经破解了它而不需要任何 javascript(而且，只使用有效的 HTML!)，在空闲浏览到 this question 之后其中有一个展示 <!--[if !(IE)]><!--> Anyone but IE <!--<![endif]--> 的答案技巧:

<!--[if gt IE 7)]><!--> <noscript> <!--<![endif]-->
<div> Content here </div>
<!--[if gt IE 7)]><!--> </noscript> <!--<![endif]-->

noscript 标签，即 noscript 条件，只有在不是旧版 IE 时才会被读取。所以旧版IE不管javscript是否激活都会显示内容，非老版IE只有满足noscript条件才会显示内容。

---

澄清...

非 IE 浏览器跳过评论，将其阅读为:

<!-- blah blah --> <noscript> <!-- blah blah -->
<div> Content here </div>
<!-- blah blah --> </noscript> <!-- blah blah -->

IE 8+ 会看到条件注释，符合条件，并阅读所有内容。这会立即关闭评论并显示 <noscript>标签:

<!-- --> <noscript> <!-- -->
<div> Content here </div>
<!-- --> </noscript> <!-- -->

旧版 IE 看到条件注释，不符合条件，因此跳过所有内容，直到它到达 [endif]。没有 <noscipt>标签，它总是显示后备内容:

<!--[STOP READING]...[START READING]-->
<div> Content here </div>
<!--[STOP READING]...[START READING]-->