单击JavaScript中的事件

Question

如何在使用纯JavaScript单击Html元素时知道当前Html元素的ID？

GC SQL

当我点击这个div的主体时，我想抓住“myId”。这意味着当我点击<div id="myId"> <div> <h2>First Div</h2> </div> <div> <h2>Second Div</h2> </div> </div> 和First Div时，我想获得父div的ID。

我的JS代码如下所示。

Second Div

Answer 1

event.currentTarget将成为事件触发的dom元素。

Answer 2

您可以通过以下方式执行此操作：

＆＃13;

＆＃13;

var div = document.getElementById('myId');
div.addEventListener('click', function(e){
  console.log(this.getAttribute('id'))
});

＆＃13;

<div id="myId">
  <div>
    <h2>First Div</h2>
  </div>
  <div>
    <h2>Second Div</h2>
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;

Answer 3

你可以在vanilla JS中这样做，在文档上注册一个事件处理程序并检索被点击元素的id：

＆＃13;

＆＃13;

document.addEventListener("click", function(e){
    alert(e.srcElement.id);
});

＆＃13;

<p id="paragraph1">First Paragraph</p>

<button id="myButton">Click Me</button>

＆＃13;

＆＃13;

＆＃13;

Answer 4

你可以写一个函数：

function showid(elem) { 
    var id = elem.id
    console.log(id)
    alert(id)
}

在您的HTML代码中：

<div id="myId" onclick="showid(this)">
  <div>
    <h2>First Div</h2>
  </div>
  <div>
    <h2>Second Div</h2>
  </div>
</div>