Javascript Chrome扩展中的背景脚本与内容脚本

我在网站上读到了背景页面和内容脚本 但我对它们感到困惑，我不明白什么时候使用背景脚本，什么时候使用内容脚本。例如：

manifest.json

：

{
    "name": "Hello World",
    "version": "2.0",
    "manifest_version": 2,
    "background": 
    {
        "scripts": ["background.js"]
    },
    "content_scripts":
    [
        {
            "matches": ["http://*/*", "https://*/*"],
            "js": ["js/myScript.js"]
        }
    ],
    "permissions": ["tabs", "http://*/*"],
    "browser_action":
    {
        "default_icon": "icon.png"
    }
}

如果

background.js

是：

//当用户单击浏览器操作时调用。
chrome.browserAction.onClicked.addListener（函数（选项卡）{
警报（“测试”）；
});

它工作得很好，但是如果我把上面相同的代码放在

myScript.js

中，它就不工作了

---

所以我不知道哪个脚本应该位于

background.js

，哪个应该位于内容脚本中。

实际上，是在网页上下文中运行的JavaScript文件。通过使用标准文档对象模型（DOM），他们可以读取浏览器访问的网页的详细信息，或者对其进行更改

---

扩展的一个常见需求是使用一个长时间运行的脚本来管理某些任务或状态。背景页面是在扩展过程中运行的HTML页面。它在您的扩展生命周期内一直存在，并且一次只有一个实例处于活动状态。

我知道这个问题很久以前就存在了，但我最近进入了Chrome扩展开发，并与您一样提出了确切的问题。因此，我希望我的回答能对这种困惑有所帮助

您已指定

myScript.js

作为内容脚本。将代码放入内容脚本时无法工作的原因是它需要侦听浏览器按钮单击事件。然而，内容脚本对ChromeAPI的访问有限，主要是

Chrome.runtime

event。它无法检测

chrome.browserAction.onClick

事件

另一方面，后台脚本可以访问chromeapi的完整数组

何时使用背景脚本而不是内容脚本取决于您的扩展目标。是否要简单地更改网页的显示方式？然后您只需要内容脚本，而不需要背景脚本。例如，如果您希望在任何网页上进行扩展以切换暗模式，则可以不使用背景脚本

如果您想保存一个站点列表的用户首选项，您的扩展将在该列表上自动切换暗模式，该怎么办？然后添加一个后台脚本：-将他们的首选项存储到Chrome存储中

• 检测用户何时登录到列表中的站点
• 向内容脚本发送消息，指示其切换暗模式

---

这不是最好的例子，但我的观点是，当您需要处理常见功能并保持用户体验时，需要使用后台脚本。

嗨，谢赫，谢谢您的快速回答。但这只是理论。我想问一些具体的情况：我需要处理点击浏览器的动作图标，哪个内容脚本或背景？或者我想刷新（F5）页面，……我应该使用背景脚本还是内容脚本？Thank@DarkLight，是的，您可以使用内容脚本，请参见和。嗨@TheAlpha，我有一个问题。在性能或处理方面，它们都有任何区别。如果我必须处理一些大的脚本，哪一个地方更适合做背景脚本或内容脚本？或者这两种方式都会造成一些失误？这取决于你的需要，对于大脚本来说，处理一些常见的东西背景脚本更好。“他们可以阅读浏览器访问的网页的细节，或者对其进行更改。”我在Youtube视频中找到了这一极好的解释-