外部CSS文件不会与我的外部HTML文件链接

Question

我正在尝试创建一个网站，但我希望网站的不同部分（导航栏）具有外部HTML文件。因此，就像您通常所做的那样，我将HTML文件链接在一起并且可以正常工作，但是对于第二个文件的CSS文件，情况就大不一样了。我曾经将文件链接到网站，但是由于某种原因它无法正常工作。

我检查是否有错误，仍然没有链接。我尝试使用不同的链接方式，notta。

我用来链接CSS文件的链接标记：

class BaseballStats {
  constructor() {
    this.totalItems = 0;
    this.list = document.querySelector("baseball");
  }

  init(url, bool) {
    this.bool = bool;

    var that = this;

    console.log(url);

    fetch(url)
      .then(resp => resp.json())
      .then(data => {
        console.log(data.stats);

        that.data = data;

        if (this.bool) {
          that.items = that.data.stats;
          this.totalItems = that.items.length;

          console.log("about to loop");

          for (var i = 0; i < this.totalItems; i++) {
            var listNode = document.createElement("LI");

            listNode.innerHTML = `<p>${this.items[i]}</p>`;
            console.log("did it reach here");

            this.list.appendChild(listNode);
          }
        }
      });
  }
}

下面是我的animations.css文件：

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

希望您能够知道我在说什么

Answer 1

首先，请确保您的css和html文件位于同一文件夹中，如果该文件夹不起作用，请检查浏览器的控制台并确保错误为0。没有错误表示您已正确链接，如果您使用的是chrome，我建议您清除浏览器的缓存并尝试刷新页面。我遇到了类似的问题，即CSS不会在chrome上更新，所以我希望该解决方案对您有用。

提示：为了始终获得CSS的最新副本，请打开浏览器的开发人员工具，然后找到“网络”标签，然后选中“禁用缓存”按钮。这将阻止您的浏览器缓存文件，并且每次都会得到一个新副本。检查下面的图片。