我希望这是一个相当简单的问题。首先，我会说我正在使用 jQuery 和 jscookie。
我有 2 个不同的 CSS 文件，一个浅色主题和一个深色主题。最初在 <head>我有这个 <link>标签:
<link id="theme" rel="stylesheet" href="css/dark.css" />
默认加载深色主题。
我有这样一种情况，用户可以使用按钮切换主题，这也会更新一个 cookie，说明他们的主题偏好。由于深色主题是默认的，我们只需要检查用户是否偏好“浅色”主题。我有一些在头部运行的 javascript，就在链接下方:
if(theme_preference == 'light') { // theme_preference is the value of the cookie
jQuery('#theme').attr('href', 'css/light.css');
}
这段代码有 50% 的时间在加载任何页面内容之前工作并且主题已更改，但另外 50% 的时间在页面加载之前(我假设？)jQuery 运行，因此用户将直观地看到页面从深色主题切换到浅色主题。
我需要利用什么事件/其他东西来确保此代码执行并更新 <link> href 在用户看到任何屏幕之前？
非常感谢任何能为我指明正确方向的人!
最佳答案
考虑到(正如我们在评论中讨论的那样)您也使用 PHP。 您可以让 PHP 读取 cookie 并使用该变量。由于 PHP 是在您的浏览器加载网站之前处理的，因此它将设置正确的配置。 Cookie 是特定于浏览器的，而不是特定于编程语言的。以下是用 PHP 实现的方法:http://www.w3schools.com/php/php_cookies.asp
关于javascript - 在加载可视页面之前加载 CSS 'theme'，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37361310/