devtools.panels.create()
向开发者工具添加一个新面板。
此函数接受：一个标题、一个图标文件的 URL 和一个 HTML 文件的 URL。它会在开发者工具中创建一个新面板，其内容由 HTML 文件指定。它返回一个 Promise，该 Promise 解析为一个 ExtensionPanel 对象，代表新创建的面板。
语法
js
let creating = browser.devtools.panels.create(
title, // string
iconPath, // string
pagePath // string
)
参数
title-
string。面板的标题。这将显示在开发者工具窗口顶部的标签行中，是用户识别您的面板的主要方式。 iconPath-
string。指定一个图标，该图标将显示在标题旁边。它以 URL 的形式提供，指向已包含在扩展程序中的图像文件。基于 Chromium 的浏览器和 Safari 会将此 URL 解析为绝对路径，而 Firefox 则会将此 URL 解析为相对于当前扩展页面（除非它被表示为绝对 URL，例如 "/icons/panel.png"）。 pagePath-
string。指定一个 HTML 文件，该文件定义了面板的内容。它以 URL 的形式提供，指向已包含在扩展程序中的 HTML 文件。该 URL 可能会被解析为绝对 URL 或相对于当前扩展页面。有关更多信息，请参阅浏览器兼容性数据。HTML 文件可以像普通网页一样包含 CSS 和 JavaScript 文件。在面板中运行的 JavaScript 可以使用开发者工具 API。请参阅 扩展开发者工具。
返回值
一个 Promise，它将被一个 ExtensionPanel 对象（代表新面板） fulfilled。
示例
创建一个新面板，并为其 onShown 和 onHidden 事件添加监听器
js
function handleShown() {
console.log("panel is being shown");
}
function handleHidden() {
console.log("panel is being hidden");
}
browser.devtools.panels
.create(
"My Panel", // title
"/icons/star.png", // icon
"/devtools/panel/panel.html", // content
)
.then((newPanel) => {
newPanel.onShown.addListener(handleShown);
newPanel.onHidden.addListener(handleHidden);
});
浏览器兼容性
加载中…
注意：此 API 基于 Chromium 的 chrome.devtools.panels API。