Какова точная разница между свойством currentTarget и целевым свойством в javascript

Ответ 1

В принципе, пузырь событий по умолчанию, поэтому разница между ними:

• target - это элемент, инициировавший событие (например, пользователь нажал)
• currentTarget - это элемент, к которому подключен прослушиватель событий.

См. простое объяснение этого сообщения .

Ответ 2

target= элемент, вызвавший событие.

currentTarget= элемент, который прослушивает событие.

Ответ 3

Минимальный работоспособный пример

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>

Ответ 4

Если это не прилипает, попробуйте следующее:

текущий в currentTarget относится к настоящему. Это самая последняя цель, которая поймала событие, которое пузырилось из других источников.

Ответ 5

<style>
  body * {
    margin: 10px;
    border: 1px solid blue;
  }
</style>

<form onclick="alert('form')">FORM
  <div onclick="alert('div')">DIV
    <p onclick="alert('p')">P</p>
  </div>
</form>

Ответ 6

event.target - это node, из которого произошло событие, т.е. везде, где вы размещаете прослушиватель событий (по абзацу или диапазону), event.target ссылается на node (где пользователь нажал).

event.currentTarget, напротив, относится к node, к которому был подключен приемник текущего события. То есть. если мы добавили наш прослушиватель событий в параграф node, то event.currentTarget ссылается на абзац, а event.target все еще ссылается на span. Обратите внимание: если у нас также есть прослушиватель событий в теле, то для этого event-listener event.currentTarget ссылается на body (т.е. Событие, предоставляемое в качестве входных данных для event-listerners, обновляется каждый раз, когда событие барботирует один node вверх).