如何使用 JavaScript 將樣式表加入 Head 部分？

在Body 中使用JavaScript 將樣式表新增至Head 部分

如果您遇到需要在網站頭部新增CSS 樣式表的場景節，但無法直接編輯頭部，您可以使用JavaScript 程式碼動態注入樣式表。儘管建議在頭部插入連結元素，但大多數瀏覽器都能在正文中很好地處理它。

以下是實現此目的的方法：

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}");

您也可以使用JavaScript 將其直接插入到headhead部分，而不是附加到正文的末尾（從技術上講，這不是連結元素的建議位置）：

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

透過利用JavaScript，您可以有效地將樣式表添加到網站的頭部部分，即使您無權直接編輯頭部本身。

以上是如何使用 JavaScript 將樣式表加入 Head 部分？的詳細內容。更多資訊請關注PHP中文網其他相關文章！