如果<noscript> OR <! - [if lte IE 7]>满足条件注释,而不重复内容,则显示内容？

Question

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

如果有人使用旧的IE,或者使用禁用Javascript的浏览器,我们会给他们一些简单的静态内容作为后备:普通图像和文本.

我可以通过复制静态内容,<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 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>标签......它的存在的情况下,有人IE6 IE7或关闭了Javascript,所以他们没有看到的内容两次......我听说过谁拥有传统定制一些企业系统 - 绑定到旧版IE的构建系统这样做是一种让旧IE稍微安全的可怕方法......)

如果我将条件内容包装在<noscript>,或者反之亦然,它将是'AND'逻辑 - 仅在满足两个条件时显示(IE6/7且禁用Javascript).

是否有任何方法可以通过'OR'逻辑使其工作 - 所以有一个内容块,如果没有Javascript,或者如果IE低于版本7 ,则显示一个内容块？或者一些聪明的简单可靠的方法<noscript>,如果浏览器启用了Javascript并且是IE的旧版本(理想情况下,无需等待文档就绪),则使用Javascript来打开？

由于我已经在使用条件注释,严格的标准符合性并不是什么大问题,例如,如果有一种方法涉及<noscript>标记属性中的脚本,那就没问题了.jQuery语法也很好.

向旧的IE或noscript浏览器提供一块后备内容的简单,干净的方式将是非常有用的.

Answer 1

我想我已经破解了它而不需要任何javascript(并且,只使用有效的HTML!),在idley浏览到这个问题之后有一个答案展示了这个<!--[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时才被读取.因此,无论javscript是否处于活动状态,旧的IE都会显示内容,而非旧的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]-->