当我单击元素时如何获取元素的 ID [关闭]答案

【问题标题】：How get Id of element when i click on the element [closed]当我单击元素时如何获取元素的 ID [关闭]
【发布时间】：2019-05-30 11:13:35
【问题描述】：

我有 2 个 div(HTML) 元素，id 是 div1 和 div2，当我点击任何 div 时，我想要当前 div 的 id...想法？

<div id="div1"></div>
<div id="div2"></div>

<div id="displayid"></div>

if(clickedDivId = this.id){
var div = document.getElementsByTagName("div");
var divCount = div.length;
var clickedDivId;
for (var i = 0; i < divCount; i += 1) {

    div[i].onclick = function(e) {
        clickedDivId = this.id;
        event.stopPropagation();

    };
} 
}

document.getElementById("displayid").innerHTML = ??clickedDivId??how;

【问题讨论】：

displayed on the screen by click--点击究竟是什么？
应该是if(clickedDivId == this.id){
用jQuery，可以将click事件绑定到document对象，然后查看目标是什么：$(document).click(function(event) { console.log(event.target); });
每个元素都被点击了..如果我点击div1来显示它的名字，通过点击div2来显示它的名字，div3，div4......
@aldin_abdagic - div1 是 id 属性值，而不是 name。

标签： javascript html innerhtml

【解决方案1】：

尝试修改自己的代码

var div = document.getElementsByTagName("div");
var divCount = div.length;
var clickedDivId;
for (var i = 0; i < divCount; i += 1) {

    div[i].onclick = function(e) {
        e.stopPropagation();
        clickedDivId = this.id;        
        document.getElementById("displayid").innerHTML = this.id;

    };
}

【讨论】：

【解决方案2】：

使用this.id 获取被点击的div 的id。

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

<div id="div1">Div 1</div>
<div id="div2">Div 2</div>

<div id="displayid">Div 3</div>

【讨论】：

【解决方案3】：

document.addEventListener('click',function(e){
  var divToDisplay = event.target.id
  document.getElementById('displayid').innerHTML = divToDisplay
})

<div id="div1">DIV TEST 1</div>
<div id="div2">DIV TEST 2</div>

<div id="displayid"></div>

【讨论】：