Event.target
Властивість target
інтерфейсу Event
є посиланням на об'єкт який відправив подію. Він відрізняється від Event.currentTarget
коли обробник події викликається в фазі спливання або фіксації події.
Синтаксис
var 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 The definition of 'Event.target' in that specification. |
Living Standard | |
DOM4 The definition of 'Event.target' in that specification. |
Obsolete | |
Document Object Model (DOM) Level 2 Events Specification The definition of 'Event.target' in that specification. |
Obsolete | Initial definition |
Сумісність з браузерами
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!
Feature | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|---|
Basic support | (Yes) | (Yes) | (Yes) | (Yes) | (Yes) | (Yes) |
Feature | Android | Edge | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|
Basic support | (Yes) | (Yes) | (Yes) | (Yes) | (Yes) | (Yes) |
Нотатки про сумісність
В браузерах IE 6-8 використовується інша модель подій. Слухачі подій приєднуються з використанням нестандартного методу EventTarget.attachEvent
. В цій моделі, об'єкт події має Event.srcElement
властивість, замість властивості target
, і воно має ту ж саму семантику як event.target
.
function hide(e) {
// Підтримка IE6-8
var target = e.target || e.srcElement;
target.style.visibility = 'hidden';
}