Javascript 单击事件来做某事

我现在正在制作一个chrome扩展，它工作得非常完美，我想在一个方面得到一些帮助

我已通过清单文件将扩展名设置为仅在我的网站中工作

现在，我想让用户在我的网站上按一个按钮

layerConfirm

扩展应该打开一个新选项卡，其中包含我想要的链接

   var element = document.getElementsByClassName('layerConfirm');
    element.onclick = function() {
        chrome.tabs.create({
            url: "http://example.com/"
        });
    };

如果我把这段代码放到“background.js”文件中，它会工作吗？你的意见是什么

更新：或者我应该在popup.js文件中添加以下代码

document.addEventListener('DOMContentLoaded', function() {
    var element = document.getElementsByClassName('layerConfirm');
    element.onclick = function() {
        chrome.tabs.create({
            url: "http://example.com/"
        });
    };
});

---

document.getElementsByClassName

返回具有该类的所有元素的数组列表，它随元素一起提供。如果DOM中只有一个元素具有此类，则可以像下面的

文档那样使用它。getElementsByClassName（'LayerConfig'）[0]

，否则请使用id属性，因为按钮位于网站上，您不能在弹出脚本或背景脚本中使用onclick处理程序，因为它们是完全独立的文档，见文件

现在，既然该站点是您的，那么显而易见且最简单的解决方案就是将按钮包装在html中的链接中：

<a href="http://example.com/" target="_blank"><button class="layerConfirm">123</button></a>

背景脚本：

chrome.runtime.onMessage.addListener(function(msg, sender, sendResponse) {
    if (msg.action == 'confirmed') {
        chrome.tabs.create({url: "http://some.url"});
    }
});

---

我已经试过了，但这两种方法都不起作用@wOxxOm@wOxxOm没有，没有错误debugger@wOxxOm听着，我只想做一个onclick监听器，所以每当有人点击网页上的一个按钮（example1.com），扩展就会打开一个带有（example2.com）的新标签，这就是我在这里要做的。我不明白我的代码哪里错了。。。我得到了具有classname的元素，如果单击该元素，我只需打开一个新选项卡。当我尝试.length时，只有一个元素，但即使使用[0]对象也不起作用。Remove document.addEventListener（'DOMContentLoaded'，function（）{}）。这可能不需要。下面是一个演示，将看到警报框，但由于我没有那个扩展名，您可能会看到无法读取控制台中未定义错误的属性“create”

chrome.runtime.onMessage.addListener(function(msg, sender, sendResponse) {
    if (msg.action == 'confirmed') {
        chrome.tabs.create({url: "http://some.url"});
    }
});