为什么 currentTarget 值为 null

Question

我正在学习event.target和event.currentTarget。我想我很清楚两者之间的区别。event.currentTarget但陷入了价值为零的境地。

以下是 HTML 和 JS 代码片段：

HTML代码

<form id="form">
   This is a form
</form>

JavaScript 代码

 form.addEventListener('click', func);

 function func(event) {
    console.log(event.target.tagName);  //line1
    console.log(event.currentTarget.tagName); //line2

    setTimeout(()=> {
       console.log(event.target.tagName);  //line3
       console.log(event.currentTarget.tagName); //line4
    }, 0)  ;
 }

我的疑问是，在第 1 行和第 3 行中我得到了event.target相同的值。event.currentTarget但是line2和line4的值是有区别的。

第 3 行的输出是“form”，但第 4 行的输出是：

未捕获的类型错误：无法读取 null 的属性“tagName”。

这意味着currentTargetline4 中为 null。

你能解释一下为什么 的值currentTarget在null第 4 行吗？

Answer 1

https://developer.mozilla.org/en-US/docs/Web/API/Event/currentTarget。注意该行

注意：的值event.currentTarget仅在处理事件时可用。如果您将事件对象存储在变量中，然后在控制台中console.log()查找键，则其值将为 null`。currentTarget