javascript - 使用 Javascript 获取 ID

Question

我有一组 DIV，我希望在鼠标点击它们时能够识别它们。以下是我目前使用的HTML代码的缩减:

<div id="1" style="position: absolute; top: 0px; left: 0;"></div>
<div id="10" style="position: absolute; top: 0px; left: 0;"></div>
<div id="11" style="position: absolute; top: 0px; left: 0;"></div>

<div style="position: absolute; top: 450px; left: 0;">
    <button onclick="sendAnswer()">Answer</button>
    <p id="demo"></p>
</div>

(目前)有 24 个这样的 DIV，使用二进制表示法作为它们的 ID。

我添加了一个事件监听器:

document.addEventListener("click", function(){
    document.getElementById("demo").innerHTML = "Hello " + event.target.id;
});

因此，我弹出 Hello 一词，但没有弹出我在其上单击的 DIV 的 ID。

我一直在其他地方探索建议，但无济于事。

为了澄清，每个二进制 ID dIV 都分配了一个随机图像，我最终打算将其拖放到网格上。我已经让它们可以拖动了，但是代码杂乱、笨拙且断断续续。我有另一个想法，但它要求我识别刚刚点击的元素。

Answer 1

你总是在监听器回调中得到事件，你可以从那里得到 id

document.addEventListener("click", function(event){
    document.getElementById("demo").innerHTML = "Hello " + event.target.id;
});

<div id="1" >1</div>
<div id="10" >2</div>
<div id="11" >3</div>

<div id="demo"></div>