イベントを発生させたオブジェクトへの参照です。 イベントハンドラーがバブリング、またはキャプチャフェーズの間に呼び出されたとき、event.currentTarget とは異なります。

構文

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> 要素を参照します
  // これはコンテキスト内の親 <li> を参照する e.currentTarget とは異なります
  e.target.style.visibility = 'hidden';
}

// リストにリスナーを接続します
// <li> がクリックされた時に発火します
ul.addEventListener('click', hide, false);

 

仕様

 

仕様 状態 コメント
DOM
Event.target の定義
現行の標準  
DOM4
Event.target の定義
廃止された  
Document Object Model (DOM) Level 2 Events Specification
Event.target の定義
廃止された 初回定義

ブラウザー実装状況

 

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeEdge MobileAndroid 版 FirefoxAndroid 版 OperaiOS 版 SafariSamsung Internet
基本対応Chrome 完全対応 ありEdge 完全対応 ありFirefox 完全対応 ありIE 完全対応 ありOpera 完全対応 ありSafari 完全対応 ありWebView Android 完全対応 ありChrome Android 完全対応 ありEdge Mobile 完全対応 ありFirefox Android 完全対応 ありOpera Android 完全対応 ありSafari iOS 完全対応 ありSamsung Internet Android ?

凡例

完全対応  
完全対応
実装状況不明  
実装状況不明

 

互換性のための注記

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';
}

関連項目

ドキュメントのタグと貢献者

このページの貢献者: Uemmra3, dskmori, chikoski, YuichiNukiyama
最終更新者: Uemmra3,