Event.target

Свойство target интерфейса Event является ссылкой на объект, который был инициатором события. Он отличается от Event.currentTarget, если обработчик события вызывается во время всплытия (bubbling) или захвата события.

Синтаксис

theTarget = event.target

Значение:

EventTarget

Пример

Свойство event.target может быть использовано для реализации делегирования событий.

// Создадим список
var ul = document.createElement('ul');
document.body.appendChild(ul);

var li1 = document.createElement('li');
var li2 = document.createElement('li');
ul.appendChild(li1);
ul.appendChild(li2);

function hide(e){
  // e.target ссылается на кликнутый <li> элемент
  // Он отличается от e.currentTarget который будет ссылаться на родительский <ul> в этом контексте
  e.target.style.visibility = 'hidden';
}

// Назначим обработчик к списку
// Он будет вызван когда кликнут на любой <li>
ul.addEventListener('click', hide, false);

Спецификации

Specification
DOM Standard
# ref-for-dom-event-target③

Поддержка браузеров

BCD tables only load in the browser

Примечания

В IE 6-8 модель событий отличается. Обработчики событий назначаются с помощью нестандартного EventTarget.attachEvent (en-US) метода. При этом в объекте события есть свойство Event.srcElement, вместо target свойства, но по смыслу оно идентично event.target.

js

function hide(e) {
  // Поддержка IE 6-8
  var target = e.target || e.srcElement;
  target.style.visibility = 'hidden';
}

Смотрите также