javascript - 在正文中使用 javascript 将样式表添加到 Head

Question

我使用的 CMS 阻止我们编辑头部部分。我需要将 css 样式表添加到站点，就在标记之后。有没有办法用 JS 做到这一点，我可以在页面底部添加一个脚本(我有权在标记之前添加脚本)，然后将样式表注入(inject)头部部分？

Answer 1

更新:根据specs ，正文中不允许使用 link 元素。但是，大多数浏览器仍会很好地呈现它。因此，要回答评论中的问题 - 确实必须将 link 添加到页面的 head 而不是 body。

function addCss(fileName) {

  var head = document.head;
  var link = document.createElement("link");

  link.type = "text/css";
  link.rel = "stylesheet";
  link.href = fileName;

  head.appendChild(link);
}

addCss('{my-url}');

或者使用 jquery 更简单一些

function addCss(fileName) {
   var link = $("<link />",{
     rel: "stylesheet",
     type: "text/css",
     href: fileName
   })
   $('head').append(link);
}

addCss("{my-url}");

---

原始答案:

不一定要加到head，加到body标签的末尾即可。

$('body').append('<link rel="stylesheet" type="text/css" href="{url}">')

正如 Juan Mendes 提到的，您可以将样式表插入到头部

$('head').append('<link rel="stylesheet" type="text/css" href="{url}">')

没有 jQuery 也是一样(见上面的代码)