我想知道如何通过简单地单击一个 div 我想获得他的 ID [重复]答案

【问题标题】：I would like to know how by doing a simple click on a div I want get his ID [duplicate]我想知道如何通过简单地单击一个 div 我想获得他的 ID [重复]
【发布时间】：2021-05-01 09:07:29
【问题描述】：

我目前正在开发一个 Javascript 项目。

我想知道如何通过点击获取元素的ID。

这是我的代码：

const cercleEl = document.querySelectorAll(".cercle");

cercleEl.forEach((element) => {
  const elementId = element.getAttribute("id");
});
document.addEventListener("click", cercleEl);

【问题讨论】：

添加一个 HTML 示例。
cercleEl 是一个 NodeList，你不能使用一个 nodelist 作为事件处理程序。

标签： javascript

【解决方案1】：

 document.querySelectorAll('.circle').forEach(function(element) {
   element.addEventListener('click', () => {
     console.log(element.id);
   });
 });

【讨论】：

【解决方案2】：

你可以这样试试。您需要将 ,addEventListener 添加到 forEach 循环中的特定元素

const cercleEl = document.querySelectorAll(".cercle");

cercleEl.forEach((element) => {
   element.addEventListener("click", function() {
    console.log(this.getAttribute("id"))

  });
});

<div class="cercle" id="a">
  <h1>hi</h1>
</div>


<div class="cercle" id="b">
  <h1>hello</h1>
</div>

【讨论】：

它的工作:)

【解决方案3】：

你可以这样做：

document.addEventListener('click', (ev)=>{
    console.log(ev.target.id)
});

ev.target 是您点击的元素。因此，您可以使用ev.target.id 轻松找到它的ID。无需在开始时创建所有元素 ID 的列表。

【讨论】：