答案是通过WebExtensions API使用JavaScript操作浏览器扩展。manifest.json定义元信息和权限，background.js监听事件如点击并注入content-script.js，后者修改DOM但需通过chrome.runtime.sendMessage与background通信，实现跨上下文交互，从而控制标签页、网络请求等行为。
JavaScript 操作浏览器扩展的 API 主要是通过浏览器提供的 WebExtensions API 实现的。这类 API 允许你在扩展的不同部分（如背景脚本、内容脚本、弹出页面等）中使用 JavaScript 来控制浏览器行为，比如操作标签页、监听网络请求、读取或修改页面内容等。
了解扩展的基本结构
一个典型的浏览器扩展包含以下几个核心文件：
- manifest.json：定义扩展的元信息和权限
- background.js：运行在后台的脚本，用于监听事件
- content-script.js：注入到网页中的脚本，可操作页面 DOM
- popup.html / popup.js：点击扩展图标时弹出的界面
这些部分都可以使用 JavaScript 调用 WebExtensions API，但权限和可用 API 可能不同。
在 background.js 中使用扩展 API
背景脚本通常用于监听浏览器事件，例如标签变化、网络请求或用户点击。
立即学习“Java免费学习笔记（深入）”；
示例：监听浏览器动作按钮被点击chrome.action.onClicked.addListener((tab) => {
chrome.scripting.executeScript({
target: { tabId: tab.id },
files: ['content-script.js']
});
});这段代码会在用户点击扩展图标时，向当前标签页注入 content-script.js。
在 content-script 中与页面交互
content script 可以访问和修改网页的 DOM，但它运行在独立的环境，不能直接调用 chrome.* API（除了少数例外）。
示例：修改页面标题
// content-script.js document.title = '已被扩展修改';
如果需要从 content script 调用扩展 API，必须通过消息传递机制与 background script 通信。
通过消息传递跨上下文通信
content script 和 background script 之间可以通过 chrome.runtime.sendMessage 和 chrome.runtime.onMessage 通信。
content-script 发送消息
chrome.runtime.sendMessage({ action: 'changeTabTitle', title: '新标签名' });background.js 接收消息
chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
if (request.action === 'changeTabTitle') {
chrome.tabs.update(sender.tab.id, { title: request.title });
}
});这种模式是扩展开发中最常见的交互方式。
基本上就这些。只要配置好 manifest 权限，合理划分 background 和 content script 的职责，并通过消息通信，就能用 JavaScript 灵活操作浏览器扩展功能。
