Event.currentTarget

La propriété currentTarget, accessible en lecture seule et rattachée à l'interface Event, identifie la cible courante pour l'évènement lorsque celui-ci traverse le DOM. Elle fait toujours référence à l'élément sur lequel le gestionnaire d'évènement a été attaché tandis que Event.target identifie l'élément à partir duquel l'évènement s'est produit (event.target peut donc être un descendant de event.currentTarget).

Syntaxe

var currentEventTarget = event.currentTarget;

Valeur

EventTarget

Exemples

Event.currentTarget peut s'avérer utile lorsqu'on attache le même gestionnaire d'évènement à plusieurs éléments.

// Cette fonction masque la cible courante de l'évènement
// et l'affiche dans la console.
function hide(e){
  e.currentTarget.style.visibility = 'hidden';
  console.log(e.currentTarget);
  // Lorsque cette fonction est utilisée en gestionnaire d'évènement
  // on aura this === e.currentTarget
}

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

for(var i = 0; i < ps.length; i++){
  // On affiche l'élément <p> qui a été cliqué dans la console
  ps[i].addEventListener('click', hide, false);
}
// On affiche l'élément <body> dans la console
document.body.addEventListener('click', hide, false);

Note : La valeur de event.currentTarget est uniquement disponible lorsque l'évènement est géré. Ainsi, on ne pourra pas observer la valeur de currentTarget a posteriori (ex. si on a stocké la valeur d'event dans une variable lors de la gestion de l'évènement puis qu'on utilise celle-ci plus tard, event.currentTarget aura la valeur null).

Spécifications

Spécification État Commentaires
DOM
La définition de 'Event.currentTarget' dans cette spécification.
Standard évolutif
DOM4
La définition de 'Event.currentTarget' dans cette spécification.
Obsolete
Document Object Model (DOM) Level 3 Events Specification
La définition de 'current event target' dans cette spécification.
Obsolete
Document Object Model (DOM) Level 2 Events Specification
La définition de 'Event.currentTarget' dans cette spécification.
Obsolete Initial definition

Compatibilité des navigateurs

Update compatibility data on GitHub
OrdinateurMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariWebview AndroidChrome pour AndroidFirefox pour AndroidOpera pour AndroidSafari sur iOSSamsung Internet
currentTargetChrome Support complet 1Edge Support complet 12Firefox Support complet 1IE Support complet 9
Support complet 9
Aucun support 6 — 9
Notes
Notes On Internet Explorer 6 through 8, the event model is different. Event listeners are attached with the non-standard EventTarget.attachEvent method. In this model, there is no equivalent to event.currentTarget and this is the global object. One solution to emulate the event.currentTarget feature is to wrap your handler in a function calling the handler using Function.prototype.call with the element as a first argument. This way, this will be the expected value.
Opera Support complet 7Safari Support complet 10WebView Android Support complet 1Chrome Android Support complet 18Firefox Android Support complet 4Opera Android Support complet 10.1Safari iOS Support complet 10Samsung Internet Android Support complet 1.0

Légende

Support complet  
Support complet
Voir les notes d'implémentation.
Voir les notes d'implémentation.

Voir aussi