Chrome扩展程序:加载不同的内容脚本

时间:2011-09-27 01:51:39

标签: javascript google-chrome permissions google-chrome-extension manifest

我想根据当前选中的页面和标签加载不同的内容脚本。现在,我有三个内容脚本。我想将其中两个用于一个页面,将第三个用于另一个页面。

属于第1页:

content_script.js load_content_script.js

属于第2页:

newtab_content_script.js

现在我的清单看起来像这样

{
  "name": "A plugin for AdData express. Generate an instant excel document from the brands you check mark.",
  "version": "1.0",
  "background_page": "background.html",
  "permissions": [
    "cookies",
    "tabs", 
    "http://*/*", "https://", "*", "http://*/*", "https://*/*",
    "http://www.addataexpress.com", "http://www.addataexpress.com/*"
  ],
  "content_scripts": [
    {
      "matches": ["<all_urls>","http://*/*","https://*/*"],
      "js": ["load_content_script.js", "content_script.js", "newtab_content_script.js", "jquery.min.js", "json.js"]
    }
  ],
  "browser_action": {
      "name": "AdData Express Plugin",
      "default_icon": "icon.png",
      "js": "jquery.min.js",
      "popup": "popup.html"
  }
}

我如何在清单或其他地方构建这个?

3 个答案:

答案 0 :(得分:75)

为了完整性,您从清单中执行此操作的方式是根据需要在“content_scripts”下设置尽可能多的matches块:

"content_scripts": [
  {
    "matches": ["http://www.google.com/*"],
    "css": ["mygooglestyles.css"],
    "js": ["jquery.js", "mygooglescript.js"]
  },
  {
    "matches": ["http://www.yahoo.com/*"],
    "css": ["myyahoostyles.css"],
    "js": ["jquery.js", "myyahooscript.js"]
  }
],

答案 1 :(得分:20)

不是使用绑定到清单中指定的URL表达式的内容脚本,而应使用executeScript,它允许您以编程方式决定何时注入JS片段或文件:

chrome.tabs.executeScript(null, {file: "content_script.js"});

答案 2 :(得分:4)

你应该使用Programmatic injection

chrome.tabs.executeScript(null, {file: "content_script.js"});