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.