用于保存暗模式设置的Javascript在Firefox的子文件夹中不起作用。如何解决这个问题？

我在一个网站上添加了暗模式，并添加了一个.js来保存用户选择的设置。它可以在与索引相同级别的所有页面中完美工作，但每个页面都有自己的文件夹，无法在firefox中获得保存的设置。它在铬合金中工作得非常好。下面是我使用的javascript：

document.addEventListener('DOMContentLoaded', function () {
  const checkbox = document.querySelector('.dark-mode-checkbox');

  checkbox.checked = localStorage.getItem('darkMode') === 'true';

  checkbox.addEventListener('change', function (event) {
    localStorage.setItem('darkMode', event.currentTarget.checked);
  });
});

---

在我使用的文件夹中的页面中

。如何让他们选择的设置在整个页面上工作？

问题在于JavaScript的相对包含路径。您的JavaScript不包含在子页面中，因为它们位于子目录中。所以你的相对路径将被打破

您的JavaScript代码在其他方面似乎很好（尽管您没有包括激活暗模式的部分，因此我假设索引级别页面可以正常工作）

改变

<script src="../js/darkmode.js"></script>

到

（或任何需要的绝对路径。）

您可以使用

元素中的HTML基本标记来更改作为“顶级”路径的路径

例如

经过一些测试后，我发现我在本地打开了该网站，这就是它不起作用的原因。在localhost中打开后，它在Firefox和Chrome上运行良好。它甚至在子目录中保存了设置。

奇怪。这似乎对我有用。你说每个页面都有自己的文件夹是什么意思？@USAF这里是我的文件夹布局示例，当你检查其中一个不工作的页面上的本地存储时，它是否包含暗模式键？我仍然无法重现这个问题。也许是因为你使用的浏览器？@美国空军我试用了Chrome浏览器，效果很好。我使用Firefox。为什么它在那里不起作用？我试过了，但是我在主页上设置的设置在带有seb目录的页面中没有使用。与主索引处于同一级别的页面确实应用了相同的设置。基本标记也不起作用。@Volkan索引页面的URL是什么？以及.js文件的（绝对）URL是什么？你可以用

www.example.com

替换域，这一部分应该不重要，主要索引是/index.html，js文件是/js/darkMode.js。不起作用的索引来自子页面，如/news/index.html。将加载脚本，但会单独保存设置。但在chrome中，它工作得非常完美。@Volkan注意，您有

darkMode.js

，而我的答案中的脚本标记有

darkMode.js

。你能试着改变其中一个的大小写，使之匹配吗？

<script src="/js/darkmode.js"></script> 

<base href="http://www.example.com/some/sub/path/">