Capa do Ebook gratuito Como utilizar o Javascript no desenvolvimento de sites web

Como utilizar o Javascript no desenvolvimento de sites web

4.5

(4)

37 páginas

Eventos em Javascript

Capítulo 9

Tempo estimado de leitura: 2 minutos

+ Exercício
Audio Icon

Ouça em áudio

0:00 / 0:00

O Javascript é uma linguagem de programação muito utilizada no desenvolvimento de sites web e uma das suas principais características é a capacidade de interagir com o usuário por meio de eventos. Eventos são ações que ocorrem no navegador do usuário, como o clique em um botão, a digitação em um campo de formulário ou a rolagem da página.

Para lidar com eventos em Javascript, é necessário utilizar o método addEventListener(), que permite associar uma função a um evento específico. Por exemplo, para executar uma função quando o usuário clicar em um botão, podemos utilizar o seguinte código:

const botao = document.querySelector('#meu-botao');

botao.addEventListener('click', function() {
  alert('O botão foi clicado!');
});

Nesse exemplo, utilizamos o método querySelector() para selecionar o botão com o id "meu-botao" e adicionamos um ouvinte de evento para o evento "click". Quando o usuário clicar no botão, a função anônima passada como segundo parâmetro será executada e exibirá um alerta na tela.

Além do evento "click", existem diversos outros eventos que podem ser utilizados em Javascript, como "submit" (quando um formulário é enviado), "keydown" (quando uma tecla é pressionada) e "scroll" (quando a página é rolada).

Também é possível remover um ouvinte de evento utilizando o método removeEventListener(). Por exemplo, se quisermos remover o ouvinte de evento para o botão do exemplo anterior, podemos utilizar o seguinte código:

Continue em nosso aplicativo

Você poderá ouvir o audiobook com a tela desligada, ganhar gratuitamente o certificado deste curso e ainda ter acesso a outros 5.000 cursos online gratuitos.

ou continue lendo abaixo...
Download App

Baixar o aplicativo

botao.removeEventListener('click', minhaFuncao);

É importante lembrar que eventos em Javascript podem ser utilizados para criar interações mais dinâmicas e atraentes em sites web, mas também devem ser utilizados com cuidado para não sobrecarregar o navegador do usuário e prejudicar a experiência de uso.

Agora responda o exercício sobre o conteúdo:

_Qual método é utilizado em Javascript para associar uma função a um evento específico?

Você acertou! Parabéns, agora siga para a próxima página

Você errou! Tente novamente.

O método addEventListener() é utilizado para associar uma função a um evento específico em Javascript. Ele permite adicionar ouvintes de eventos aos elementos e definir ações quando esses eventos ocorrem.

Próximo capitúlo

Trabalhando com formulários em Javascript

Arrow Right Icon
Baixe o app para ganhar Certificação grátis e ouvir os cursos em background, mesmo com a tela desligada.