Please enable JavaScript.

Coggle requires JavaScript to display documents.

Praticando o uso do DOM - Coggle Diagram

- - - - Associar um manipulador de eventos: Em seguida, você precisa associar um manipulador de eventos ao elemento selecionado. Um manipulador de eventos é uma função que será executada quando o evento ocorrer. Existem algumas maneiras de fazer isso:
        
        Atribuição direta: Você pode atribuir uma função diretamente a uma propriedade de evento do elemento.
        
        Método addEventListener: Uma forma mais flexível de associar eventos é usar o método addEventListener. Isso permite adicionar vários manipuladores de eventos para o mesmo tipo de evento em um elemento.
        
        Manipular o evento: Dentro do manipulador de eventos, você pode escrever o código que será executado quando o evento ocorrer. Isso pode incluir ações como modificar o conteúdo HTML, alterar estilos, fazer solicitações AJAX, validar dados de entrada, entre outras tarefas.
  - - - click: Acionado quando um elemento é clicado.
      - mouseover: Acionado quando o cursor do mouse entra em um elemento.
      - mouseout: Acionado quando o cursor do mouse sai de um elemento.
      - mousemove: Acionado quando o cursor do mouse se move dentro de um elemento.
    - - keydown: Acionado quando uma tecla é pressionada.
      - keyup: Acionado quando uma tecla é liberada.
      - keypress: Acionado quando uma tecla é pressionada e solta.
    - - submit: Acionado quando um formulário é enviado.
      - input: Acionado quando o valor de um elemento de input é alterado.
      - focus: Acionado quando um elemento recebe foco.
      - blur: Acionado quando um elemento perde o foco.
    - - load: Acionado quando uma página ou recurso é carregado.
      - unload: Acionado quando uma página é fechada ou navegada para fora.
      - resize: Acionado quando a janela do navegador é redimensionada.
      - scroll: Acionado quando a barra de rolagem é movida.
    - - touchstart: Acionado quando um toque é iniciado em um elemento touch.
      - touchend: Acionado quando um toque é finalizado em um elemento touch.
      - touchmove: Acionado quando um toque se move em um elemento touch.
      - touchcancel: Acionado quando um toque é cancelado.