使背景页面在 Google Chrome 扩展程序中可见答案

【问题标题】：Make background-page visible in Google Chrome extension使背景页面在 Google Chrome 扩展程序中可见
【发布时间】：2012-03-28 08:12:20
【问题描述】：

我的谷歌浏览器扩展中有一个background-page，这个页面自然是不可见的。有没有办法让这个隐藏的页面可见，比如在点击浏览器操作图标时弹出？然后再次单击将其隐藏。

【问题讨论】：

标签： google-chrome google-chrome-extension

【解决方案1】：

可以使用chrome.tabs.create 方法显示背景页面，该方法需要tabs permission。比如你的后台页面叫background.html，可以使用如下代码：

chrome.tabs.create({url: chrome.extension.getURL('background.html')});

另见：

【讨论】：

新标签页中的背景页面是与后台不可见页面相同的页面，还是会打开该页面的另一个实例，而不可见背景页面仍然不可见？
@Nyxynyx 是background.html 的新实例。您将在Active views 部分看到两个background.html 链接。此外，chrome.extension.getBackgroundPage()==window 是 false。没有方法可以显示隐藏的活动背景页面。您可以使用扩展中的链接，该链接显示后台页面的开发人员工具。在此屏幕中，所有功能（包括实时 DOM 检查器）都可用。
感谢后台页面的开发者工具真的很有帮助！猜猜这是我能看到的最接近调试目的的页面。
@RobW，window.alert 和后台页面提示有效.. 这是预期的行为吗？
@Pacerier。是的，在 Chrome 中是这样。

【解决方案2】：

您可以在browserAction popup 中打开backround_page。然而，它将是background_page 的一个新实例。一个在打开时作为弹出窗口，而在后台长期存在的不可见。

【讨论】：

【解决方案3】：

在您的扩展程序的弹出页面中，添加一段 JS 用于实用程序 chrome.runtime.getBackgroundPage(callback)。将背景页面的<html> 元素指定为id，并使用window.getElementById("myBackgroundPageHTMLElementId")

例如，您的回调可能如下所示：

document.getElementById("myPopupHTMLElementId").outerHTML = backgroundWindow.getElementById("myBackgroundPageHTMLElementId").outerHTML

这个 JS 脚本完成后，弹出页面的 HTML 元素将完全替换为背景页面（直到你重新加载它）！这意味着所有属性，甚至是 HTML 元素上的属性都设置为背景页面的版本。

希望这会有所帮助！

【讨论】：