我正在尝试组合一个 Chrome 扩展程序来更改(或覆盖)网站图标并将其替换为不同的图像。搜索时我什么也没找到,所以我假设这不能完成?用 Javascript 或 html 完成对我来说并不重要;我只是想知道这是否可能。感谢所有帮助,谢谢!
最佳答案
是的你可以。
有两种方法可以做到这一点:
1.使用内容脚本
manifest.json
{
"manifest_version": 2,
"name": "My Extension",
"version": "1.0.0",
"content_scripts": [
{
"matches": ["<all_urls>"],
"js": ["content-script.js"],
"run_at": "document_end"
}
]
}
内容脚本.js
document.querySelector('link[rel*="icon"]').href = "//placehold.it/32/F00"
2.使用后台脚本+代码注入(inject)
manifest.json
{
"manifest_version": 2,
"name": "My Extension",
"version": "1.0.0",
"background": {
"scripts": ["background.js"]
},
"permissions": [
"tabs",
"http://*/*",
"https://*/*"
]
}
背景.js
chrome.tabs.onUpdated.addListener((tabId, changeInfo) => {
if (changeInfo.status === 'complete') {
chrome.tabs.executeScript(tabId, {
code: 'document.querySelector(\'link[rel*="icon"]\').href = "//placehold.it/32/F00"'
});
}
});
附言考虑选择比
link[rel*="icon"]
更好的选择器更新 #1
上面的示例显示了如何从外部资源加载新图标。
作为替代方案,也可以使用
base64
图像的表示或将图标放在扩展包中并使用 web_accessible_resources 请求它和 chrome.runtime.getURL
关于google-chrome - 使用 Chrome 扩展程序更改网站图标?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45972000/