这是一个远景，我怀疑我正在尝试做的事情最终是不可能的。
我正在尝试在我的网站上实现暗/亮模式切换。问题是该站点只是 S3 上的静态文件，因此没有我可以控制的服务器端。
我遇到的问题是在加载新页面时加载正确的主题，因为该值存储在本地存储中，我需要获取它并在页面加载时更改值。
我当前的方法使用初始类 hidden在更改为 light 的主体上或 dark什么时候DOMContentLoaded火灾。不幸的是，这仍然会导致在更改类之前发生一次绘制。通过将 JS 放在 <head> 中我能够在 Safari 和 Chrome 中绕过该问题，但无法绕过 Firefox。
初始绘制发生的问题是它会导致极其刺耳的闪烁，尤其是当屏幕快速从白色变为黑色时启用更暗时。
所以我的问题是是否有可能以某种方式更改 body 的类之前DOMContentLoaded着火了？
谢谢
最佳答案
您可以将类添加到 <html> 中，而不是将类添加到正文中元素，来自 <head>部分。
这样，该类将在主体加载之前应用。示例代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Test</title>
<style>
html.dark body{background:black;}
</style>
<script>
document.getElementsByTagName('html')[0].setAttribute('class', 'dark');
</script>
</head>
<body>
</body>
</html>
关于javascript - 在第一次绘制之前修改 body 的类，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37126401/