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

时间:2012-10-28 12:15:08

标签: javascript html internet-explorer noscript conditional-comments

我正在开发一个不支持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则会显示一个内容块, OR 如果IE如果浏览器启用了Javascript并且是IE的旧版本(理想情况下,无需等待文档准备好),那么使用Javascript切换<noscript>的一些聪明的简单可靠方法?< / p>

由于我已经在使用条件评论,因此严格标准合规性不是很大,例如如果有一种方法涉及<noscript>标签属性中的脚本,那就没问题了。 jQuery语法也很好。

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

1 个答案:

答案 0 :(得分:6)

我认为我已经破解了它而不需要任何javascript(并且,只使用有效的HTML!),在idley浏览到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]-->