1
resposta

[Dúvida] Não entendi nada

Insira aqui a descrição dessa imagem para ajudar na acessibilidade
Minha dúvida é só tudo que ela fala, não consigo compreender os temos e didática que ela fala, estou na aula "ouvinte de eventos", parte dois "detectando interações", tudo que ela escreveu ai não consegui compreender alguém poderia me ajudar?

Matricule-se agora e aproveite até 50% OFF

O maior desconto do ano para você evoluir com a maior escola de tecnologia

QUERO APROVEITAR
1 resposta

Olá Pedro.
Vou tentar te ajudar mas já adianto que é preciso tempo e muita pratica para entender os conceitos e de fato o que ocorre por debaixo dos panos de cada codigo escrito.
Aqui vai uma explicação linha por linha:

const inputItem = document.getElementById("input-item");
  • O JavaScript procura no HTML um elemento que tenha o id = "input-item".
  • Esse elemento é guardado dentro da variável inputItem.
  • Normalmente, esse elemento é um <input> onde o usuário digita alguma coisa.
const botaoAdicionar = document.getElementById("adicionar-item");
  • Parecido com a linha anterior.
  • Aqui ele busca um elemento com o id = "adicionar-item".
  • Geralmente é um botão que o usuário clica para adicionar algo.
botaoAdicionar.addEventListener("click", (evento) => {
    console.log(evento.target);
    console.log(inputItem.value);
})

botaoAdicionar.addEventListener("click", (evento) => {

  • Aqui o código diz:
    “Quando alguém clicar no botão, execute esta função.”
  • "click" é o tipo de evento.
  • (evento) é um objeto que contém informações sobre o clique: onde clicou, qual elemento foi clicado, etc.
console.log(evento.target);
  • Mostra no console qual elemento foi clicado.
  • evento.target quase sempre será o próprio botão.
console.log(inputItem.value);
  • Mostra no console o texto digitado dentro do <input>.
  • .value é a propriedade que guarda o conteúdo inserido pelo usuário.

})

  • Fecha a função e o event listener.

Resumo :

  • O código pega um input e um botão da página.
  • Quando o botão é clicado:
    • Mostra no console qual elemento foi clicado.
    • Mostra o texto digitado pelo usuário no input.

Analisa ai e qualquer duvida comente.
Bons estudos.