Identifica o alvo atual para o evento quando o event percorre o DOM. O currentTarget sempre se refere ao elemento associado ao event handler, ao invés do event.target que identifica o elemento ao qual o evento ocorreu.
Exemplo
event.currentTarget é bom para ser usado quando nós queremos associar o mesmo event handler para vários elementos.
function hide(e){
e.currentTarget.style.visibility = "hidden";
console.log(e.currentTarget);
// Quando essa função é usada como um event
// handler: this === e.currentTarget
}
var ps = document.getElementsByTagName('p');
for(var i = 0; i < ps.length; i++){
// console: print the clicked <p> element
ps[i].addEventListener('click', hide, false);
}
// console: print <body>
document.body.addEventListener('click', hide, false);
// Clique e faça os parágrafos desaparecerem
Especificações
| Especificação | Status | Comentário |
|---|---|---|
| DOM The definition of 'Event.currentTarget' in that specification. |
Padrão em tempo real | |
| DOM4 The definition of 'Event.currentTarget' in that specification. |
Obsoleto | |
| Document Object Model (DOM) Level 3 Events Specification The definition of 'current event target' in that specification. |
Obsoleto | |
| Document Object Model (DOM) Level 2 Events Specification The definition of 'Event.currentTarget' in that specification. |
Obsoleto | Definição incial |
Compatibilidade dos navegadores
| Característica | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|---|
| Supote básico | (Yes) | (Yes) | (Yes) | (Yes)[1] | (Yes) | 10.0 |
| Característica | Android | Edge | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|---|
| Supote básico | ? | (Yes) | ? | ? | ? | 10.0 |
[1] Do Internet Explorer 6 até o 8, o modelo do event é diferente. Event listeners estão acoplados com o EventTarget.attachEvent método não padronizado. Neste modelo não há um equivalente para event.currentTarget e this é um objeto global. Uma solução para simular o event.currentTarget é envolver seu handler em uma função e chamando-a usando o Function.prototype.call com o elemento sendo o primeiro argumento. Desta forma, this será o valor esperado.