イベントを発生させたオブジェクトへの参照です。 イベントハンドラーがバブリング、またはキャプチャフェーズの間に呼び出されたとき、event.currentTarget とは異なります。
構文
theTarget = event.target
例
event.target プロパティは、イベントデリゲーションを実装するために使用できます。
// HTML ul 要素のインスタンスを含む 'list' 変数があると仮定します。
function hide(e) {
// リスト項目がマージンで分離されている場合を除き、e.target は e.currentTarget とは異なっているべきです。
e.target.style.visibility = 'hidden';
}
list.addEventListener('click', hide, false);
// 何らかの要素（<li> 要素や <li> 要素内の a リンク）がクリックされた場合、要素は非表示になります。
// これを行うために、リスナは１つだけで十分です。
仕様
| 仕様 | 状態 | コメント |
|---|---|---|
| DOM Event.target の定義 |
現行の標準 | |
| DOM4 Event.target の定義 |
勧告 | |
| Document Object Model (DOM) Level 2 Events Specification Event.target の定義 |
勧告 | 初回定義 |
ブラウザー実装状況
| 機能 | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|---|
| 基本サポート | (有) | (有) | (有) | (有) | (有) | (有) |
| 機能 | Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
| 基本サポート | (有) | (有) | (有) | (有) | (有) |
互換性のための注記
IE 6-8 では、イベントモデルが異なります。イベントリスナーは、非標準の EventTarget.attachEvent メソッドでアタッチされます。このモデルでは、イベントオブジェクトは target プロパティの代わりに、Event.srcElement プロパティを持っており、意味的には event.target と同じです。
function hide(e) {
// IE6-8 をサポート
var target = e.target || e.srcElement;
target.style.visibility = 'hidden';
}