Event.target
Свойство target
интерфейса Event
является ссылкой на объект, который был инициатором события. Он отличается от Event.currentTarget
, если обработчик события вызывается во время всплытия (bubbling) или захвата события.
Синтаксис
theTarget = event.target
Значение:
Пример
Свойство 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 | Status | Comment |
---|---|---|
DOM Определение 'Event.target' в этой спецификации. |
Живой стандарт | |
DOM4 Определение 'Event.target' в этой спецификации. |
Устаревшая | |
Document Object Model (DOM) Level 2 Events Specification Определение 'Event.target' в этой спецификации. |
Устаревшая | Первоначальное определение. |
Поддержка браузеров
We're converting our compatibility data into a machine-readable JSON format.
This compatibility table still uses the old format,
because we haven't yet converted the data it contains.
Find out how you can help! (en-US)
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
Basic support | (Да) | (Да) | (Да) | (Да) | (Да) |
Feature | Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|
Basic support | (Да) | (Да) | (Да) | (Да) | (Да) |
Примечания
В IE 6-8 модель событий отличается. Обработчики событий назначаются с помощью нестандартного EventTarget.attachEvent
метода. При этом в объекте события есть свойство Event.srcElement
, вместо target
свойства, но по смыслу оно идентично event.target
.
function hide(e) {
// Поддержка IE 6-8
var target = e.target || e.srcElement;
target.style.visibility = 'hidden';
}