Solucionado (ver solução)
Solucionado
(ver solução)
3
respostas

Necessidade event.target

Boa tarde pessoal,

Qual a necessidade do event.target?

Nesse teste simples os valores são os mesmos. O que poderia dar errado? Ainda nao entendi....

const nome = event.target.querySelector('[data-nome]'); console.log(nome.value);

const nome2 = document.querySelector('[data-nome]'); console.log(nome2.value);

Obrigado,

3 respostas
solução!

Olá, Rafael.

Usamos o event.target quando, por exemplo, passamos uma informação para o evento dentro do html.Ou seja, se você clicar no primeiro item da lista, o target vai se referir ao item clicado.

Att,

Lays

Olá Rafael, imagino que vc tem uma lista (ul) de elementos (li), onde todos o sitens usam a mesma classe ".item".

HTML

<ul>
    <li class="item" >Item 1</li>
    <li class="item" >Item 2</li>
    <li class="item" >Item 3</li>
</ul>

JS

ul.addEventListener("click", function(event){

}) 

Ao usar o código:

ul.addEventListener("click", function(event){
    document.querySelector('.item');
}) 
  • você receberá todos os elementos como retorno.

Já ao usar o código:

ul.addEventListener("click", function(event){
     event.target.querySelector('.item')
}) 
  • Você receberá exatamente o item que vc clicou.

Espero ter ajudado.

Ficou bem claro. Obrigado, pessoal!

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software