#drops Entendendo event.target e event.currentTarget no JavaScript

Você aí, sabia que além do "event.target", bastante usado no JavaScript, existe o "currentTarget" e que várias vezes você quis ter ele no seu código e não sabia?

A diferença entre event.target e event.currentTarget é que event.target é o elemento que disparou o evento, enquanto event.currentTarget é o elemento que possui o listener de eventos vinculado a ele.

Por exemplo, você tem um botão dentro de uma div, e ambos têm listener de eventos de clique. Clicar no botão disparará ambos os eventos. No handler de eventos do botão, event.target será o botão e event.currentTarget também será o botão. No handler de eventos da div, event.target ainda será o botão, mas event.currentTarget será a div. A propriedade event.relatedTarget é relevante apenas para eventos de mouse e contém o elemento que o mouse entrou ou saiu.

Uma dica legal é estudar sobre o delegate pattern. Deixo aqui as referências para você se aprofundar:

Continue acompanhando o blog para mais dicas de desenvolvimento em geral! 😍

Postagens por ai: