chrome 扩展弹出窗口中的按钮答案

【问题标题】：Buttons in chrome extension popupchrome 扩展弹出窗口中的按钮
【发布时间】：2012-11-12 11:08:55
【问题描述】：

我正在编写一个 chrome 扩展程序，我希望按钮由于某些用户的操作而出现在弹出页面中（比如说，在他通过弹出页面登录到我的网站之后）。 Documentation 声明不会执行内联 JavaScript，建议的实现方式是使用

document.addEventListener('DOMContentLoaded', function () {
 document.querySelector('#button1').addEventListener('click', clickHandler);
});

当 'button' 是 popup.html 中的标签时。

但事情是这样的：我不希望按钮在页面加载时出现，如上所述。当我尝试使用$("#some_div").append(<button id="button1">...<button>) 添加按钮然后调用document.addEventListener 时，似乎document.querySelector 没有找到附加的按钮（实际上它返回null），因为它不是原始popup.html 的一部分。

到目前为止，我想到的唯一解决方案是将 popup.html 中的按钮添加为隐藏，并在需要时将其设置为可见。

任何其他想法（或者，希望我都错了）将不胜感激。

【问题讨论】：

标签： button jquery-selectors google-chrome-extension popup

【解决方案1】：

您可以尝试使用var newButton = document.createElement('button') 创建按钮并使用appendChild 而不是append。然后你可以写newButton.addEventListener('click', clickHandler)。

【讨论】：

感谢您的回答。我试过以下方法： var newButton = document.createElement('button'); ("#some_div").appendChild(newButton);但我在控制台日志上收到错误消息：“some_div has no method 'appendChild'
好的，我想通了。我必须使用 DOM 方法 document.getElementById("popup").appendChild()，而不是 ("popup").appendChild()。谢谢。