Question

我有一个域名列表（大约10个），我的chrome扩展程序将与之交互。

在我研究Chrome扩展程序文档时，需要使用content_scripts 我已将这些行包含在manifest.json

中

   "content_scripts": [ {
      "all_frames": true,
      "js": [ "js/main.js" ],
      "matches": [ "http://domain1.com/*",
                   "http://domain2.com/*",
                   "http://domain3.com/*",
                   "http://domain4.com/*",
                   "http://domain5.com/*",
                   "http://domain6.com/*",
                   "http://domain7.com/*",
                   "http://domain8.com/*",
                   "http://domain9.com/*",
                   "http://domain10.com/*"
      ],
      "run_at": "document_start"
   }],

这意味着在加载每个页面时，url与清单文件中定义的url匹配，然后main.js将被注入页面。我对吗？是

所以我想在通过page action

注入脚本时做一些UI

我将这些行包含在清单中：

   "page_action": {
      "default_icon": "images/pa.png",
      "default_title": "This in one of that 10 domains, that is why I showed up!"
   },

似乎还不够。我必须手动触发页面操作。但是哪里？我意识到为此我需要一个background.html文件。

但为什么我不能在同一个main.js文件中包含触发器？回答：

However, content scripts have some limitations. They **cannot**:

 - Use chrome.* APIs (except for parts of chrome.extension)
 - Use variables or functions defined by their extension's pages
 - Use variables or functions defined by web pages or by other content scripts

因此将其包含在清单中：

"background_page": "background.html"

这是内容：

        <html>
          <head>
            <script>
                function check (tab_id , data , tab){
                    //test just one domain to be simple
                    if (tab.url.indexOf('domain1.com') > -1){
                        chrome.pageAction.show(tab_id);
                    };
                };
                chrome.tabs.onUpdated.addListener(check);
            </script>
          </head>

        </html>

在此之前足够公平，

我想要的和我不知道是如何添加切换扩展程序的功能。

用户点击页面操作图标 - ＆gt;图标更改并关闭/打开（main.js会有所不同）

Answer 1

您可以将chrome.tabs.onUpdated与chrome.tabs.executeScript结合使用，而不是通过清单添加内容脚本：

// Example:
var url_pattern = /^http:\/\/(domain1|domain2|domain3|etc)\//i;
chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab) {
    if (url_pattern.test(tab.url)) {
        if (changeInfo.status === 'complete') { // Or 'loading'
            chrome.tabs.executeScript(tabId, {'file':'main.js'});
            chrome.pageAction.show(tabId);
        }
    } else {
        chrome.pageAction.hide(tabId);
    }
});

不要忘记检查值changeInfo.status，否则，内容脚本将被执行两次。

在其中一个if语句中，您可以检查扩展是否有效，并对其进行操作：

if (changeInfo.status === 'complete' && am_I_active_questionmark) ...

方面不是：您也可以使用background_page，而不是使用"background": {"scripts":["bg.js"]}，并将后台脚本放在bg.js中。

将JavaScript注入预定义页面并使用页面操作

1 个答案: