附加到html頁面腳本和CSS無效

Question

我試圖將一些CSS和JS附加到我的靜態HTML文件中。 CSS和JS文件存儲在同一文件夾中。 這聽起來很愚蠢，但我需要這樣做。 因此，已添加CSS和JS，但由於背景應為紅色，因此它們不適用於HTML文件。 我創建的路徑是正確的，因為如果我inspect element了Chrome Devtools上的inspect element並單擊了附加鏈接，它將打開我需要的內容。 因此，沒有錯誤，腳本會附加我需要的內容，但是我看不到任何結果。

我的HTML檔案

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Home</title>
</head>
<body>

hello world

<script>
  const href = window.location.pathname;
  const chunkIndex = href.lastIndexOf('/');
  const path = href.slice(0, chunkIndex + 1);

  function appendScripts() {
    const script = document.createElement("script");
    script.src = path + "scripts.js";    // use this for linked script
    document.body.appendChild(script);
  }

  function appendCSS() {
    link=document.createElement('link');
    link.href= path + 'styles.css';
    link.rel='rel';
    document.getElementsByTagName('head')[0].appendChild(link);
  }

  document.addEventListener("DOMContentLoaded", function(event) {
    appendCSS();
    appendScripts();
  });
</script>

</body>
</html>

我的CSS文件：

body {
  background-color: red;
}

Answer 1

您需要修復以下行

link.rel='rel';

至

link.rel='stylesheet';

附加到html頁面腳本和CSS無效

問題描述

1 個解決方案

解決方案1
2 已采納 2017-11-18 10:10:52

附加到html頁面腳本和CSS無效

問題描述

1 個解決方案

解決方案1 2 已采納 2017-11-18 10:10:52

解決方案1
2 已采納 2017-11-18 10:10:52