向 Chrome 扩展程序中的按钮添加点击事件

Question

我想将单击事件添加到按钮元素中，我通过运行 executeScript 函数在 chrome.tabs.onUpdated 事件函数中动态添加它。

chrome.tabs.onUpdated.addListener(() => {
chrome.tabs.executeScript(null, {file: "execute.js" });
})

我在动态添加的按钮元素中添加了一个单击事件函数，并在执行 execute.js 文件中使用此代码，但它不起作用;

var btnComment=document.createElement('button');
btnComment.addEventListener('click',function(){
console.log('btnComment worked')
});

我使用背景.html里面的页面请求背景.js文件。如何实现此功能？

Answer 1

不幸的是，由于缺乏程序外观的上下文，我无法给出 100% 确定的答案。 但是，我认为问题是您需要首先使用 DOM 专门选择元素。

尝试

document.getElementById('button').addEventListener('click',function(){
console.log('btnComment worked')
});

有关文档对象模型的详细信息，请参阅：https://www.w3schools.com/js/js_htmldom.asp

编辑：拼写

Answer 2

你的后轮.html有这个吗？

<script src="background.js"></script>

请注意，您在 execute.js 中创建按钮，但您的 html 使用背景.js因此在您的background.js文件中，您将需要以下内容：

function onButtonClicked (){
console.log('btnComment worked');
}
document.getElementById('button').addEventListener('click', onButtonClicked());

顺便说一句，我也还在学习谷歌浏览器扩展程序。