Event.target.id 返回空字符串？

Question

该event.target.id属性在我的列表项事件单击处理程序中返回一个空字符串。这是为什么？

$("ol").on("click", "li", function(event) {
 let id = event.target.id; // returns ""
});

我知道我可以通过使用 来获取id列表项的$(this).attr("id")，但我只是想知道为什么上面的代码片段为 返回一个空字符串id？

event.target 很可能是 an ，因为我在和 之间<li>的 DOM 树中没有获得任何其他元素，并且一点反射表明：<ol><li>

Answer 1

您需要使用event.currentTarget

在下面的示例中，如果您单击abc，则两个日志都将绘制2，但是，如果您单击def，则第一个日志将绘制''，第二个日志将绘制2。

$("ol").on("click", "li", function(event) {
  console.log(event.target.id);
  console.log(event.currentTarget.id);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>
  <ol>
    <li id="2">
      abc
      <span>def</span>
    </li>
  </ol>

</div>