Conteúdo principal
Programação
Curso: Programação > Unidade 6
Lição 5: Eventos DOM- Tornando páginas web interativas com eventos
- Adicionando um listener de evento
- Tipos de evento DOM
- Usando as propriedades do evento
- Desafio: O bigode do gato
- Processando formulários com eventos
- Prevenção de comportamento padrão de eventos
- Resumo: eventos DOM
© 2023 Khan AcademyTermos de usoPolítica de privacidadeAviso de cookies
Tipos de evento DOM
O navegador dispara muitos eventos. Uma lista completa está disponível no MDN, mas aqui estão alguns dos tipos e nomes de eventos mais comuns:
- eventos de mouse (
MouseEvent
): mousedown, mouseup, click, dblclick, mousemove, mouseover, mousewheel, mouseout, contextmenu - eventos de toque (
TouchEvent
): touchstart, touchmove, touchend, touchcancel - eventos de teclado (
KeyboardEvent
): keydown, keypress, keyup - eventos de formulário: focus, blur, change, submit
- eventos de janela: scroll, resize, hashchange, load, unload
Perceba que alguns eventos são específicos do dispositivo. Eventos de toque são disparados apenas em dispositivos como smartphones e laptops sensíveis ao toque. Eventos de mouse são disparados na maioria dos navegadores, mas às vezes eles são mais lentos que os eventos de toque nos smartphones. O evento "mouseover" não é disparado em smartphones, já que não é possível deixar o cursor sobre a tela sem tocá-la.
Alguns desenvolvedores adicionam listeners para os eventos de toque e de mouse, para que sua interface responda rapidamente em todos os dispositivos. Outros desenvolvedores usam bibliotecas como FastClick que descobre automaticamente quais eventos esperar em cada dispositivo (é isso que fazemos aqui na Khan Academy). Como você está apenas começando, o mais fácil é esperar eventos de mouse, porque eles são mais universais.
Quer participar da conversa?
- As páginas precisam incluir linhas de código tanto para touch quanto para click do mouse? Pensei que a máquina interpretasse ambos como um mesmo sinal.(1 voto)
- pelo meu pouco conhecimento... alguns eventos são universais como o "click", neste funciona tanto para touch quanto para o mouse, o mesmo não acontece com o touch.(1 voto)