We're looking for a user researcher to understand the needs of developers and designers. Is this you or someone you know? Check out the post: https://mzl.la/2IGzdXS

イベントは DOM を横断するので、イベントの現在のターゲットを識別します。イベントが発生した要素を特定する event.target とは対照的に、常にイベントハンドラがアタッチされた要素を参照します。

event.currentTarget は、同じイベントハンドラを複数の要素にアタッチしているときに使用すると興味深いです。

function hide(e){
  e.currentTarget.style.visibility = "hidden";
  // この関数がイベントハンドラとして使用されるとき: this === e.currentTarget

var ps = document.getElementsByTagName('p');

for(var i = 0; i < ps.length; i++){
  ps[i].addEventListener('click', hide, false);

// 周辺をクリックすると段落が消えます。


仕様 状態 コメント
Document Object Model (DOM) Level 2 Events Specification
Event.currentTarget の定義
廃止された 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!

機能 Chrome Firefox (Gecko) Internet Explorer Opera Safari
基本サポート (有) (有) (有)[1] (有) ?
機能 Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
基本サポート ? ? ? ? ?

[1] Internet Explorer 6 から 8 では、イベントモデルが異なります。イベントリスナは非標準の element.attachEvent メソッドでアタッチされます。このモデルでは、event.currentTarget と同等の機能はなく、this はグローバルオブジェクトです。event.currentTarget 機能をエミュレートするための 1 つの解決策は、ハンドラを最初の引数として要素とともに Function.prototype.call を使用するハンドラを呼び出す関数でラップすることです。この方法であれば、 this は予想通りの値になります。


Comparison of Event Targets


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