O que são eventos JavaScript? Veja os 10 eventos mais utilizados

O que são eventos JavaScript? Veja os 10 eventos mais utilizados
Por: Samuel J. S. Tavares
desenvolvimento de software programador iniciante front-end javascript

Neste artigo você verá o que são os eventos JavaScript e como utilizar os 10 eventos mais usados na hora que você estiver programando a sua página WEB! Vem ver!

O que é JavaScript?


O que é JavaScript?

JavaScript (JS) é uma Linguagem de Programação utilizada inicialmente para criar interação nas páginas da Internet e, posteriormente, também utilizada para criar a lógica dos Aplicativos Mobile.

Para utilizá-la, você pode inserir seu código facilmente no seu arquivo HTML, com a tag <script>.

Caso você não saiba o que é uma tag HTML, acesse o artigo "Principais Tags HTML para você praticar agora!".

E com isso, você vai conseguir deixar sua página mais interativa para o usuário, podendo:
- Exibir alertas;
- Fazer alguma coisa quando o usuário clicar em algo;
- Alterar o estilo dos elementos após alguma ação do usuário;
- Deixar sua página inteligente;
- Muitas outras coisas!

Além disso, JavaScript é uma linguagem de programação muito utilizada no mercado!

Eventos JavaScript? O que é isso?


Bem, agora que você já entendeu o que é a Linguagem JavaScript, podemos entrar no assunto deste artigo: os Eventos JavaScript!

Para que você entenda de forma mais fácil o que é um evento JS, vamos usar uma analogia bem simples:

Ao apertar o botão de ligar, no controle da sua TV, é enviado para o aparelho um comando para que a imagem apareça na tela.

Assim, você apertou o botão e uma ação foi disparada para ser executada pela televisão.

No JavaScript, funciona exatamente desta forma!

Os eventos nada mais são do que ações que deverão ser disparadas quando acontecer alguma coisa pré-definida na página.

Em analogia com o controle remoto da TV, clicar no botão é um evento!

Existem outros tipos de eventos, além de clicar no botão, vamos ver sobre eles daqui a pouco!

Principais Eventos JavaScript


Eventos JavaScript?
Veja agora alguns dos eventos JS que você mais vai utilizar quando tiver criando a sua página WEB!

Antes de continuar, é importante que você saiba que "foco" significa que um elemento foi selecionado e está pronto para receber alguma ação.

Exemplo: você clica em uma caixa de texto e ela está pronta para receber os dados.

1. Evento JavaScript onClick


O evento onClick é disparado quando um elemento é clicado uma vez pelo usuário.

Exemplo: o usuário clicou uma vez em uma div.

2. Evento JavaScript onDoubleClick


O evento onDoubleClick é disparado quando um elemento é clicado duas vezes pelo usuário.

Exemplo: o usuário clicou duas vezes em um botão.

3. Evento JavaScript onKeyDown


O evento é disparado quando o usuário pressiona uma tecla do teclado, estando com o foco naquele elemento.

Exemplo: o usuário, estando com um input com foco, pressionou a tecla "A" do teclado.

4. Evento JavaScript onKeyUp


O evento onKeyUp é disparado quando o usuário solta a tecla do teclado que havia sido pressionada, estando com o foco naquele elemento.

Exemplo: com o input em foco, o usuário solta a tecla "A".



5. Evento JavaScript onMouseOver


O evento onMouseOver é disparado quando o usuário passa o mouse sobre o elemento.

Exemplo: o usuário passa o mouse sobre um botão.

6. Evento JavaScript onMouseOut


O evento onMouseOut é disparado quando o usuário retira o mouse sobre o elemento.

Exemplo: o usuário retira o mouse de um botão.

7. Evento JavaScript onFocus


O evento onFocus é disparado quando um elemento recebe o foco.

Exemplo: o usuário seleciona um input para inserir os dados.

8. Evento JavaScript onBlur


O evento onBlur é disparado quando um elemento perde o foco.

Exemplo: o usuário clica fora do input que estava selecionado para receber dados.

9. Evento JavaScript onChange


O evento onChange é disparado quando o valor de um elemento é alterado.

Exemplo: o usuário altera o texto de um input.

10. Evento JavaScript onLoad


O evento onLoad é disparado quando o o elemento é carregado na página.

Exemplo: o input é totalmente carregado na página.

Como usar um evento JavaScript!


Para usar um evento JavaScript é muito simples, basta que você adicione o atributo da tag, com o evento correspondente e, no valor do atributo, colocar o que deve acontecer quando o evento for disparado.

Veja um exemplo:


<button onclick="alert()" > Meu botão </button>

Muito simples, não é mesmo? Agora aproveita e faz aí no seu computador!

Não pare por aqui!


Não pare por aqui
Se você está começando agora na programação, eu tenho um presente para você: o meu e-book 100% gratuito:

Para acessá-lo, é só clicar na imagem acima!

Conclusão


Então, neste artigo você viu o que é a Linguagem de Programação JavaScript, o que são os Eventos JS, os 10 principais eventos JavaScript que você pode utilizar na hora em que estiver programando o seu site!

Além disso, viu como continuar o seu caminho de aprendizagem, com um e-book totalmente grátis e feito especialmente para quem está começando sua jornada na programação!

Não deixe esta oportunidade passar, ok?

Bons estudos!

QUE TAL ALGUÉM PARA TE AJUDAR A APRENDER PROGRAMAÇÃO?


Veja outros artigos deste blog e veha ser nosso aluno!

Conheça nosso Curso Gamificado Codificando Dinheiro e tenha resultados com a programação: Aproveite para fazer Dinheiro com a Programação e aprender enquanto você se diverte, acompanhando o seu progresso na nossa plataforma gamificada, onde você poderá ganhar medalhas, conquistas, pontos e subir de nível!

Você terá acesso a uma Plataforma Gamificada, além de acesso ao Fórum Exclusivo do Aluno, podendo tirar suas dúvidas e também aproveitar para fazer networking!

E se ficou com alguma dúvida, entre em contato com a gente pelo WhatsApp (31) 99816-9203.

Compartilhe com seus amigos: Compartilhar Whatsapp
Banner Wallky Tech


Se você está começando a programar e quer ganhar tempo, este e-book é perfeito pra você!

Baixe este e-book 100% GRÁTIS e saiba como começar a programar, dar o próximo passo e não depender de copiar e colar código pronto da Internet!




*Você receberá o e-book no seu email e WhatsApp de forma gratuita.
Fique tranquilo, não enviamos SPAM!