访问被点击的元素

Question

extends ../header2.pug
block unique-css
    include ../../public/css/mentor/mentiler.css
block unique-content
    .main
        each menti, index in mentiler
            .menti= menti
    script
        include ../../public/js/mentor/mentiler.js

这是我的哈巴狗代码，我想要的是访问 .menti classed

中点击的元素

    each menti, index in mentiler
        .menti= menti

这行代码 javascript。但问题是当我在 class .menti 上添加事件监听器时，它只适用于第一个元素。

这是我的 js 代码：

document.querySelector(".menti").addEventListener("click", () => 
{
    console.log(document.querySelector(".menti").innerHTML)
})

正如我上面所说，我只能获取第一个元素。

Answer 1

querySelector() method只returns它匹配的第一个元素。

要将事件绑定到每个 .menti 元素，您需要结合使用 querySelectorAll() method 和循环：

document.querySelectorAll('.menti').forEach(menti => {
  menti.addEventListener('click', event => {
    // handle click
  })
})

访问被点击的元素

Accessing the clicked element

javascript

pug