AddEventListener

addEventListener é um método em JavaScript usado para anexar um ouvinte de evento a um elemento HTML. Ele fornece uma maneira eficaz de manipular eventos, como cliques do mouse, pressionamentos de teclas, foco, carregamento da página, etc. A principal vantagem do addEventListener é que ele permite a associação de vários ouvintes a um único evento em um elemento específico.

Aqui está a sintaxe do addEventListener:

elemento.addEventListener(evento, função, useCapture);

• elemento: O elemento HTML ao qual você deseja associar o ouvinte de evento.
• evento: Uma string que especifica o tipo de evento que você deseja ouvir (por exemplo, “click”, “keydown”, “mouseover”, etc.).
• função: A função a ser executada quando o evento ocorre.
• useCapture (opcional): Um valor booleano que especifica se o evento deve ser capturado durante a fase de captura (true) ou na fase de bubbling (false, que é o padrão).

Aqui está um exemplo de como você pode usar addEventListener para lidar com um clique de botão:

// Obtendo o elemento de botão pelo seu ID
var meuBotao = document.getElementById("meuBotao");

// Adicionando um ouvinte de evento para o evento de clique
meuBotao.addEventListener("click", function() {
    alert("Botão clicado!");
});

Neste exemplo, quando o botão com o ID “meuBotao” é clicado, a função de alerta será executada.

Você também pode usar addEventListener para lidar com eventos em outros tipos de elementos HTML, como input, divs, ou qualquer outro elemento suportado pelo DOM. O método é amplamente utilizado para criar interatividade em páginas da web.