在页面加载时将脚本注入页面使用什么类型的方法？

Question

所以我有一个chrome扩展程序，当在扩展程序中打开popup.html页面时，会在当前选项卡中注入一些javascript。我正在尝试让扩展在页面加载时注入代码，我不确定要采取什么路径。

但是，当我尝试在后台页面上运行background.js时，chrome会给我这些错误：

和

我不知道如何解决这些错误。它们似乎与权限错误有关，不允许我通过后台页面运行chrome.tabs.executeScript。我不知道后台页面无法访问所有网址，或者我在解释此错误消息时出错了？我的清单文件：

  "background": {
    "scripts": ["js/inject.js", "js/background.js"],
    "persistent": false
  },

  "browser_action": {
    "default_icon": "images/icon.png",
    "default_popup": "popup.html"
  },

  "icons": {
    "16": "images/icon16.png",
    "48": "images/icon48.png",
    "128": "images/icon128.png"
  },

  "permissions": [
    "contextMenus",
    "tabs",
    "contextMenus",
    "storage",
    "webNavigation",
    "<all_urls>"

  ],

  "web_accessible_resources": [
    "js/jquery-2.1.3.min.js"
  ],

  "content_scripts": [
      {
        "matches": ["<all_urls>"],
        "js": ["js/jquery-2.1.3.min.js", "js/inject.js"]
      }
    ],

编辑：后台代码：

function cssInject(){
  chrome.tabs.executeScript({
    code: '$("*").css("font-family", "Courier", "important"); $("*").css("font-size", "18pt", "important"); $("*").css("background-color", "#fbfbfb", "important"); $("*").css("line-height", "1.5", "important")'
  });
}
function cssRemove(){
  chrome.tabs.executeScript({
    code: '$("*").css("font-family", ""); $("*").css("font-size", ""); $("*").css("background-color", ""); $("*").css("line-height", "")'
  });
}

Answer 1

发生此错误是因为没有选项卡ID参数的chrome.tabs.executeScript尝试将代码注入当前活动选项卡。

您的错误表示您在执行该代码时打开并关注了（未停靠的）Dev Tools窗口。它被视为活动标签。

您需要专注于要为其注入代码才能使用的选项卡。停靠您的开发工具将有助于此。