javascript - 页面加载时深色主题 CSS 问题 1 秒差距

Question

我有以下代码在页面加载时将主题更改为深色。问题是有 1 秒的间隔，每次我切换到其他页面时，屏幕都会闪烁 1 秒然后变黑。我如何替换 document.body.setAttribute('data-theme', 'dark'); 以在页面加载后立即使用 dark 主题？

if ($is_dark) {

  echo "
  <link rel='stylesheet' href='$zrcdn_url/css/z-b-u/dark-theme.css'/>
  <script>document.body.setAttribute('data-theme', 'dark');</script>
  ";

}

此外，有时脚本的加载速度比 CSS 快，我使用这段代码时甚至有 2-3 秒的差距。

<script>
$(document).ready(function(){
  document.body.setAttribute('data-theme', 'dark');
});
</script>

Answer 1

尝试首先使用 html 的主体或头部内的 CSS 文件。

<style>
body {
  background-color: black;
}
</style>