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

【问题标题】：Load CSS file into head section or into HTML section without using Javascript不使用 Javascript 将 CSS 文件加载到 head 部分或 HTML 部分
【发布时间】：2013-12-27 19:57:57
【问题描述】：

我有一个网页，在该网页中，我使用页面 bootom 中的 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>

我无法将此文件直接添加到我的 head 部分中。

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

【问题讨论】：

你可以编写内联样式。
@Leifingson 我不能使用内联样式，因为这个文件在多个页面中使用，所以它给我带来了很多工作。
另外，stackoverflow.com/questions/4957446/… 和 stackoverflow.com/questions/1642212/… 可能重复
什么原因，没有添加到head部分？
@Himalya Vashistha 同样你可以把

标签： javascript jquery html css

【解决方案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>

【讨论】：

【解决方案2】：

你可以试试这个：

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

【讨论】：

我认为他不能直接添加到head
呵呵，对他的问题的回答非常尖锐：“那么是否可以在不使用 javascript 的情况下将 css 文件添加到我的 html 文档中？” ^^

【解决方案3】：

是的，可以在不使用 javascipt 的情况下加载 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 } ?>

【讨论】：

【解决方案4】：

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

现在您可以将这段代码放在 head 部分，它只会在禁用 javascript 时调用。

【讨论】：

Himalya Vashistha 不想把它放在头上，但这很好，因为可以把

【解决方案5】：

不确定这与 HTML 的兼容性如何，但您可以在 body 标记中包含一个链接，并且仍然让它引用该类，因为您无法按说明编辑 head 部分。

这样做确实对我有用，从 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 部分旨在在显示内容之前加载此类文档，但是如果这不可能，那么这可能是您的解决方案。

【讨论】：

这是正确的。样式表不必在<head> 中，但是越早将它们添加到页面中，@987654321 的可能性就越小@。只需在“公共头部”文件后使用<link> 或在该文件中使用 PHP 仅在需要它的页面上添加样式表。