Javascript 根据类添加弹出窗口（最有可能）

我试图使用Tampermonkey在画布LMS中的页面上添加一个弹出窗口。这是一个论坛，每篇帖子后都有一个“回复”选项，这就是我想添加弹出窗口的地方。但当我点击“回复”链接时，不会出现弹出窗口。它会像往常一样打开回复框，但我的弹出窗口却不见踪影

代码大致如下所示：

<div class="entry-controls hide-if-collapsed hide-if-replying">
  <div class="notification" data-bind="notification"></div>
      <a role="button" class="discussion-reply-action entry-control" data-event="addReply" href="#">
      <i class="icon-replied"></i>
      <span aria-hidden="true">Reply</span>
      <span class="screenreader-only">Reply to Comment</span>
    </a>
</div>

除了

.discussion reply action

，我还尝试使用

.entry controls

、

.notification

、

.entry control

，甚至像

span[aria hidden=“true”]

这样的东西。似乎什么都不管用

我知道Tampermonkey脚本本身的应用是正确的，因为它还有其他的功能，并且像往常一样出现

---

知道为什么这一点对我不起作用吗？我是一个彻头彻尾的JS noob，这是值得的。

这一点在回复中得到了回答，但我只是想正式指出，这归结为延迟了我的代码注入。我试图附加到文档之后加载的元素。一旦我支持了他们，它就工作得很好。

什么不工作？你没有看到警报？尝试添加

console.log（项目）

在

项之前。addEventListener（…）

并查看记录的内容。可能是在页面加载之后加载HTML，因此您可能需要使用事件委派（将事件侦听器连接到某个公共祖先，并在运行代码之前检查

event.target

是否是您想要的）。尝试事项：1<代码>控制台.log（[…document.querySelectorAll（'.discussion-reply-action'））。它应该打印项目2的列表。更改每个

项目的样式/属性。请记住，有些页面使用javascript生成额外的上下文，在这种情况下，您需要在生成项目后延迟注入。@HereticMonkey:编辑我的帖子是说：什么都没有发生。这只是通常的行为——它会打开回复框。不过，没有弹出窗口。我添加了
console.log（项目）行，但似乎没有多大区别。当我没有运行Tampermonkey代码时，单击“回复”会生成7个错误，当我运行代码时会出现相同的7个错误（我将它们区分开来）。所以我假设你关于页面加载后加载的理论可能是个问题，但我不明白你在那之后说了些什么，关于将事件侦听器附加到一个共同的祖先，等等。请参阅的答案。如果你不使用jQuery，就不要使用它。@tomáš-zato恢复monica&异端猴子：解决方案是延迟注射；你是对的。1秒钟的延迟很好地完成了任务。现在我对使用控制台有了更多的了解。谢谢你的帮助！
document.querySelectorAll('.discussion-reply-action').forEach(item => {
  item.addEventListener('click', event => {
    alert("Popup text here");
  })
})