如何使用 JavaScript 将样式表动态附加到头部？

Dynamically Append Stylesheet to Head Using JavaScript

In certain scenarios, accessing and editing the head section of a web page may be restricted. However, there remains a need to add additional stylesheets to enhance the visual appearance of the site. This raises the question: can we use JavaScript to accomplish this task, ensuring that the stylesheet is inserted after the head tag?

To address this challenge, JavaScript offers a versatile solution:

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('{myUrl}');

Alternatively, if you prefer jQuery:

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

addCss("{myUrl}");

These methods dynamically append the stylesheet link element to the head section of the HTML document, enabling you to add additional styles to your website even if access to the head section is restricted.

以上是如何使用 JavaScript 将样式表动态附加到头部？的详细内容。更多信息请关注PHP中文网其他相关文章！