如何从event.target获取元素的ID

Question

考虑下面这段看起来像这样的代码：

$('body').on('click', function(e){

});

我知道可以通过e.target.nodeName获得元素的类型，但是如何从中获取该元素的ID呢？如果无法获取，是否有其他方法可以获取被单击的元素的ID？

- Bluefire

Answer 1

您可以使用e.target.id。e.target代表DOM对象，您可以访问其所有属性和方法。

$('body').on('click', function(e){
    alert(e.target.id);    
});

您可以使用jQuery函数jQuery(e.target)或$(e.target)将DOM对象转换为jQuery对象，以便在其上调用jQuery函数。

- Adil

Answer 2

要在JavaScript中获取目标元素的属性，只需使用：

e.target.getAttribute('id');

另请参阅：https://dev59.com/NGkv5IYBdhLWcg3w40wY#10280487，以了解DOM属性和它们的属性之间微妙的区别。

- Wafae Mks

Answer 3

$('body').on('click', function(e){
    var id = $(this).attr('id');
    alert(id);
});

- imkost

---

请注意，OP正在询问e.target，这与this不一定相同 - 特别是如果单击处理程序绑定到主体。 - nnnnnn

虽然我的目标是找到一种从事件中获取元素ID的方法，但e.target只是一个建议。 - Bluefire

如果this是正确的元素，只需说this.id，无需创建jQuery对象并调用.attr()函数。 - nnnnnn

@nnnnnn，哇。使用jQuery时完全忘记了本地js。当然，使用this.id更容易。 - imkost

“this” 对我似乎不起作用；$(this).attr('id'); 返回 undefined，而 this.id 则没有返回任何内容。 - Bluefire

我怀疑问题就像我最初的评论所说的那样：“this”是body元素，因为单击处理程序附加到了它，而body没有指定id... - nnnnnn

Answer 4

试一试

 $('body').on('click', '*', function() {

    var id = $(this).attr('id');
    console.log(id); 
});

- user6213434

Answer 5

这是可以做到的：

$('body').on('click', 'a', function (e) {//you can do $(document) instead $(body)
    e.preventDefault();
    alert($(this).attr('id'));//<--this will find you the each id of `<a>`
});

- Jai

Answer 6

selectıonImg.addEventListener('click', (e) => {
  if (e.target.getAttribute('rock')) {
    userChoıceImg.innerHTML=<img src="./img/taş.png" alt="rock">
  }  
});

- Betül

---

虽然这段代码可能回答了问题，但提供关于它如何以及为什么解决问题的额外背景信息将提高答案的长期价值。 - undefined