google-chrome - 使用 Chrome 扩展程序更改网站图标？

Question

我正在尝试组合一个 Chrome 扩展程序来更改(或覆盖)网站图标并将其替换为不同的图像。搜索时我什么也没找到，所以我假设这不能完成？用 Javascript 或 html 完成对我来说并不重要；我只是想知道这是否可能。感谢所有帮助，谢谢!

Answer 1

是的你可以。
有两种方法可以做到这一点:

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