Event.target
指向最初觸發事件的 DOM 物件。與 event.currentTarget 屬性不同的是，event.currentTarget 屬性總會指向目前於冒泡或捕捉階段正在處理該事件之事件處理器所註冊的 DOM 物件，而 event.target 屬性則是永遠指向觸發事件的 DOM 物件。
語法
theTarget = event.target
範例
The event.target property can be used in order to implement event delegation.
// Make a list
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 refers to the clicked <li> element
// This is different than e.currentTarget which would refer to the parent <ul> in this context
e.target.style.visibility = 'hidden';
}
// Attach the listener to the list
// It will fire when each <li> is clicked
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! (en-US)
| 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) |
Compatibility notes
On IE 6-8 the event model is different. Event listeners are attached with the non-standard EventTarget.attachEvent (en-US) method. In this model, the event object has a Event.srcElement (en-US) property, instead of the target property, and it has the same semantics as event.target.
function hide(e) {
// Support IE6-8
var target = e.target || e.srcElement;
target.style.visibility = 'hidden';
}