事件。目标是事件产生的节点，即。无论您将事件侦听器放置在何处(在段落或span上)，事件。目标指的是节点(用户单击的地方)。

事件。相反，currentarget指向附加了当前事件监听器的节点。Ie。如果将事件监听器附加在段落节点上，则event。currentarget指向段落while事件。目标仍然指向span。 注意:如果我们在body上也有一个事件监听器，那么对于这个事件监听器，事件。currentTarget指的是body(即。作为事件监听器的输入提供的事件在每次事件冒泡一个节点时更新)。

最小可运行示例

window.onload = function() { var resultElem = document.getElementById('result') document.getElementById('1').addEventListener( 'click', function(event) { resultElem.innerHTML += ('<div>target: ' + event.target.id + '</div>') resultElem.innerHTML += ('<div>currentTarget: ' + event.currentTarget.id + '</div>') }, false ) document.getElementById('2').dispatchEvent( new Event('click', { bubbles:true })) } <div id="1">1 click me <div id="2">2 click me as well</div> </div> <div id="result"> <div>result:</div> </div>

如果你点击:

2 click me as well

然后1监听它，并在结果后面追加:

target: 2
currentTarget: 1

因为在这种情况下:

2是引发事件的元素 1是监听事件的元素

如果你点击:

1 click me

相反，结果是:

target: 1
currentTarget: 1

铬71测试。

如果这还不行，试试这个:

currentTarget中的current指的是当前。这是最新的目标，捕捉到从其他地方冒出来的事件。

事件。目标是事件产生的节点，即。无论您将事件侦听器放置在何处(在段落或span上)，事件。目标指的是节点(用户单击的地方)。

事件。相反，currentarget指向附加了当前事件监听器的节点。Ie。如果将事件监听器附加在段落节点上，则event。currentarget指向段落while事件。目标仍然指向span。 注意:如果我们在body上也有一个事件监听器，那么对于这个事件监听器，事件。currentTarget指的是body(即。作为事件监听器的输入提供的事件在每次事件冒泡一个节点时更新)。

目标=触发事件的元素。

具有事件监听器的元素。

一个实验:

document.addEventListener("click", (e) => {
  console.log(e.target, e.currentTarget);
});
document.querySelector("p").click();

输出:

<p></p>
#document

target (<p></p>)似乎是被点击的元素，而currentTarget (#document)是监听点击事件的元素。