google-chrome-extension - 页面加载后如何更改默认图标？

Question

我有这个代码来更改我的图标，但它只有在我点击它时才有效。如何在网页加载后立即更改图标？

document.addEventListener('DOMContentLoaded', function () {
  chrome.browserAction.setIcon({path: 'different_icon.png'});

});

Answer 1

您需要将消息传递到后台页面并在那里更改图标。例如，您的清单文件将包含以下内容脚本：

"content_scripts": [
    {
        "matches" : ["<all_urls>"],
        "js" : ["content.js"],
        "run_at": "document_end"
    }
],

如您所见，它在文档加载完成时运行。您的内容脚本将消息传递到后台页面：

chrome.runtime.sendMessage({changeIcon: true});

最后，您的后台页面收到消息并更改图标：

chrome.runtime.onMessage.addListener(
    function(request, sender, sendResponse) {
        if (request.changeIcon) {
            chrome.browserAction.setIcon({path: 'different_icon.png'});
        }
    }
);