我不知道如何通过Chrome扩展程序将CSS注入网页.我想把它注入一个网页:
body {
background: #000 !important;
}
a {
color: #777 !important;
}
Run Code Online (Sandbox Code Playgroud)
这是我的manifest.json:
{
"update_url":"http://clients2.google.com/service/update2/crx",
"name": "Test Extension",
"version": "1.0",
"description": "This is a test extension for Google Chrome.",
"icons": { "16": "icon16.png",
"48": "icon48.png",
"128": "icon128.png" },
"background_page": "background.html",
"browser_action": {
"default_icon": "icon19.png"
},
"content_scripts": [
{
"matches": ["http://test-website.com/*"],
"js": ["js/content-script.js"]
}
],
"permissions": [ "tabs", "http://test-website.com/*" ]
}
Run Code Online (Sandbox Code Playgroud) 我可以使用内容脚本js文件以编程方式注入CSS文件吗?
当js文件链接到我的popup.html时,我可以注入css.问题是我必须单击按钮打开弹出窗口才能注入css.我希望它在后台自动发生.
我的代码会发生什么......
正如我之前提到的,它确实可以使用弹出窗口.但是在注入CSS之前必须打开弹出窗口.
如何在没有任何用户交互的情况下自动完成这一切?
这是我的代码:
function getData() {
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
user_data = xmlhttp.responseText;
window.user_data = user_data;
processdata();
}
}
xmlhttp.open("GET","http://localhost:8888/g_dta.php",true);
xmlhttp.send();
}
getData();
function processdata() {
var downdata = user_data.split('|||||');
var installedthemes = downdata[0];
var currenttheme = downdata[1].toString();
window.currenttheme = …
Run Code Online (Sandbox Code Playgroud) javascript google-chrome google-chrome-extension google-chrome-devtools
即使在 manifest.json 中正确声明了“image/copy.svg”,我也会收到此错误
拒绝加载 chrome-extension://pofbdjeepddggbelfghnndllidnalpde/images/copy.svg。资源必须在 web_accessible_resources 清单键中列出,以便由扩展程序之外的页面加载。
如果我去 chrome-extension://pofbdjeepddggbelfghnndllidnalpde/images/copy.svg 我可以成功地看到加载的图像。
css/style.css
.copy-icon{
content:url('chrome-extension://__MSG_@@extension_id__/images/copy.svg');
height: 16px;
width: auto;
margin-right: 0px;
}
Run Code Online (Sandbox Code Playgroud)
html
<button alt="Copy to clipboard" class="clipboard" data-clipboard-text="TEXT">
<img class="copy-icon"></img>
</button>
Run Code Online (Sandbox Code Playgroud)
清单文件
"manifest_version": 3,
"content_scripts": [
{
"matches": ["https://*.example.com/*"],
"js": ["contents/results.js"],
"css": ["css/style.css"],
"run_at": "document_end"
}
],
"web_accessible_resources": [{
"resources": ["images/copy.svg"],
"matches": [],
"extension_ids": []
}],
Run Code Online (Sandbox Code Playgroud)