sidebarAction.setPanel()

设置侧边栏的面板:即定义此侧边栏内容的 HTML 文档。

面板类型

侧边栏总是有一个“清单面板”,即在 sidebar_action 清单键中定义的面板。

如果使用 setPanel() 设置新面板,并包含 tabId 选项,则该面板仅为给定的标签页设置。这个面板称为“标签页特定面板”。

如果使用 setPanel() 设置新面板,并包含 windowId 选项,则该面板仅为给定的窗口设置。这个面板称为“窗口特定面板”,并将出现在该窗口的所有没有设置标签页特定面板的标签页中。

如果使用 setPanel() 设置新面板,并省略 tabIdwindowId 选项,则这将设置“全局面板”。全局面板将出现在所有没有设置标签页特定面板,且其窗口没有设置窗口特定面板的标签中。

语法

js
browser.sidebarAction.setPanel(
  details // 对象
)

参数

details

object。包含如下属性的对象:

panel

stringnull。要加载到侧边栏中的面板,指定为指向 HTML 文档的 URL,或 null,或空字符串。

这可以指向扩展内部打包的文件(例如使用 runtime.getURL 创建的文件)或远程文档(例如 https://example.org/)。它必须是有效的 URL。

如果 panelnull"",则将删除先前设置的面板,同时:

  • 如果指定了 tabId 并且标签页设置了标签页特定面板,则标签页将从其所属窗口继承面板。
  • 如果指定了 windowId 并且窗口设置了窗口特定面板,则窗口将继承全局面板。
  • 否则,全局面板将重置为清单面板。
tabId 可选

integer。仅为指定的标签页设置面板。

windowId 可选

integer。仅为指定的窗口设置面板。

  • 如果同时提供了 windowIdtabId,函数将失败且面板不会被设置。
  • 如果同时省略 windowIdtabId,则设置全局面板。

示例

以下代码在用户点击浏览器操作时切换侧边栏文档:

js
let thisPanel = browser.runtime.getURL("/this.html");
let thatPanel = browser.runtime.getURL("/that.html");

function toggle(panel) {
  if (panel === thisPanel) {
    browser.sidebarAction.setPanel({ panel: thatPanel });
  } else {
    browser.sidebarAction.setPanel({ panel: thisPanel });
  }
}

browser.browserAction.onClicked.addListener(() => {
  browser.sidebarAction.getPanel({}).then(toggle);
});

浏览器兼容性

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Firefox for Android
Safari on iOS
setPanel
The panel property of the details parameter can be set to null.

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
No support
No support

备注: 此 API 基于 Opera 的 chrome.sidebarAction API。