我正在尝试向我的网站添加亮/暗样式功能。 我编写了一个代码，在单击按钮时在两个样式表之间切换，但每当我转到不同的路径时，样式都会返回到常规样式。
Javascript:
function swapStyleSheet(sheet){
document.getElementById('pageStyle').setAttribute('href', sheet);
}
HTML:
<link rel="stylesheet" href="/stylesheets/light.css" id="pageStyle">
<body>
<li><a id="navLinks" onclick="swapStyleSheet('/stylesheets/light.css')">Light Style!</a></li>
<li><a id="navLinks" onclick="swapStyleSheet('/stylesheets/main.css')">Dark Style!</a></li>
</body>
最佳答案
您可以使用 Web Storage API 来做到这一点.
这类似于使用 cookie，但数据存储在浏览器中而不是服务器上。所有现代浏览器都支持。
JS:
function swapStyleSheet(sheet){
document.getElementById('pageStyle').setAttribute('href', sheet);
window.localStorage.setItem("pageStyle", sheet);
}
window.onload = function() {
swapStyleSheet(window.localStorage.getItem("pageStyle"));
}
HTML:
<li><a id="navLinks" onclick="swapStyleSheet('/stylesheets/light.css')">Light Style!</a></li>
<li><a id="navLinks" onclick="swapStyleSheet('/stylesheets/main.css')">Dark Style!</a></li>
关于javascript - 如何使用 javascript 永久更改我网站中的 css 文件？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/57994886/