Question

如果禁用了javascript，如何加载外部css文件。

应该适用于IE 6到9，Firefox Google Chrome，Safari

我尝试了<noscript>并将<noscript>保留在内部，但它在IE 7中不起作用

Answer 1

我会反过来做。始终加载包含前缀为body.jsEnabled的规则的css。然后只需通过javascript在主体上添加一个“jsEnabled”类。

这种“发现能力”的方式大约是http://www.modernizr.com/的工作方式。

Answer 2

我在IE7中测试过这个方法，但它确实有效。在<style>

中添加<link>代码（而不是<noscript>

<noscript>
<style type="text/css">
 @import url (yourexternalfile.css);

body{
background-color: purple;
}

</style>
</noscript>

编辑：

这是在IE7中工作的屏幕截图。 alt text

Answer 3

试试这个：

<html>
  <head>
    <script type="text/javascript"> document.write('<'+'!--'); </script>
       <link rel="stylesheet" type="text/css" href="non-js.css">
    <!-- -->  
  </head>
  <body>
      <script type="text/javascript"> document.write('<'+'!--'); </script>
       Visible when no-JS 
      <!--  --> Always visible
  </body>
</html>

Hack，但HTML正确。如果启用了JS，则将注释开始控制标记打印到页面中 - 然后忽略第二个开始标记，结束标记关闭注释内容。因此，如果启用了JS，link标记将被注释掉，而不会被下载。

Answer 4

虽然<noscript>中不允许<head>，而<link>只允许<style> + <head>，您也可以使用此代码：

<link id="noscriptStyle" rel="stylesheet" type="text/css" href="my_external_css_file.css" />
<script type="text/javascript">
document.getElementById('noscriptStyle').parentNode.removeChild(document.getElementById('noscriptStyle'));
</script>

但我自己更喜欢cherouvim发布的方法

Answer 5

CSS-Files与启用/禁用的javascript无关...

<link rel="stylesheet" type="text/css" href="my_external_css_file.css" />

如果禁用javascript，如何加载外部css文件

5 个答案: