问题描述
好，所以我想制作一个“暗模式”插件，但是问题是我不能足够快地应用暗CSS。当我重新加载网页时，它会以白色背景加载1/2秒钟，然后加载我的深色CSS。那不是问题，但是晚上我的监视器在每次重新加载页面时闪烁（这不是很好的用户体验）。 这是我到目前为止所拥有的： 清单（脚本加载部分）：
"permissions": [
"activeTab","storage","https://www.example.com/*"
],"content_scripts": [
{
"js": [ "jquery.min.js","content.js" ],"matches": [ "https://www.example.com/*"],"run_at": "document_start"
},{
"css": ["style.css"],"matches": [ "https://www.example.com/*"]
}
],"background": {
"scripts": ["background.js"],"persistent": false
},这是content.js
chrome.storage.sync.get({
dark: true
},function(items) {
init(items.dark);
});
function init(options) {
var dark = options;
if(dark){
$( "body" ).addClass( "darkmode" );
if (document.readyState == 'loading') {
$( "body" ).addClass( "darkmode" );
document.addEventListener('DOMContentLoaded',function(){
$( "body" ).addClass( "darkmode" );
});
}
}
}
您可以在这里看到我在每个页面加载阶段都添加了“ addClass”。第一个可以正常工作，但是问题在于有时由于DOM加载速度不够快而导致该行代码无法执行。
在style.css文件内部，我正在使用CSS更改样式，如下所示：
.darkmode .somediv .etc a {
color:#fff;
}
我只需要在页面加载后立即将网站背景更改为黑色，这样一开始我就不会出现白色闪烁。其余CSS可以在1/2秒后加载，没关系。
解决方法
删除所有document.readyState，DOMContentLoaded，jQuery内容并替换为：
document.documentElement.classList.add('darkmode');
它将在<html>上已经存在的document_start节点上添加类。
请注意，一种更有效的方法是根据存储中的切换变量通过具有chrome.declarativeContent API的RequestContentScript操作动态地注册/注销内容脚本，而不是在manifest.json中声明content_scripts。该操作被标记为实验性操作，但实际上可在稳定的Chrome浏览器中使用。
依赖报错 idea导入项目后依赖报错，解决方案：https://blog....
错误1：gradle项目控制台输出为乱码 # 解决方案：https://bl...