Question

我有一个网页，在其中我使用页面引导中的javascript代码在head部分添加一个css文件：

$(document).ready(function(){
var css=document.createElement('link');
css.type='text/css';
        css.href='/css/user.css';
        css.rel='stylesheet';
        document.getElementsByTagName('head')[0].appendChild(css);
});

所以我有一个问题，当用户禁用javascript然后thic文件无法添加到页面，所以是否有任何方法在该页面中包含css文件

<noscript>..Code..</noscript>

我无法将此文件直接添加到我的头部。

那么可以在不使用的情况下将css文件添加到我的html文档中 JavaScript的？

Answer 1

使用javascript：

$("<link/>", {
   rel: "stylesheet",
   type: "text/css",
   href: "/styles/yourcss.css"
}).appendTo("head");

http://api.jquery.com/jQuery/#jQuery2

没有javascript：

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

Answer 2

你可以试试这个：

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

Answer 3

是的，可以在不使用javascript的情况下加载css文件

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

如果你想在某些条件的基础上添加css，那么使用php if语句如下所示：

<?php if(YOUR CONDITION){ ?>
  <head>
  <link rel="stylesheet" type="text/css" href="mystyle.css">
  </head>
<?php } ?>

Answer 4

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

现在您可以将此代码放在head部分中，只有在禁用javascript时才会调用它。

Answer 5

不确定HTML是如何兼容的，但是您可以在body标签中包含一个链接，并且仍然可以引用该类，因为您无法按照规定编辑头部。

这样做对我来说很有用，引用了style.css文件中的'class1'

<head>
</head>
<body>
<div class="class1"></div>
<link href="style.css" rel="stylesheet" type="text/css">
</body>

编辑：在HTML 4.01中，这是不可接受的，但是使用HTML5，这是完全可以接受的标记。如果引用较大的CSS文件，这可能导致某些元素暂时没有样式，因为head部分旨在在显示内容之前加载这些文档，但是如果这不可能，那么这可能是一个解决方案。

将CSS文件加载到head部分或HTML部分，而不使用Javascript

5 个答案: