Um evento é uma reação gerada por uma ação executada pelo o usuário, com os eventos nós podemos fazer com que nossa pagina seja muito interativa, um evento pode ser o click do mouse ou o scrolling de uma pagina, tudo depende do tipo de ação que você vai atribuir ao elemento. Abordaremos aqui algumas formas de adicionar um evento ao nosso código HTML.
A maneira mais genérica de se usar um evento é adicionando ele ao próprio HTML
EX:
Outra maneira para adicionar um evento ao HTML é colocando ele através do JS
Método EventListener
Com esse método você pode adicionar eventos a todos os elementos do DOM(Document Object Model) e com ele você deixa sua marcação HTML mais limpa pois você vai poder manipular os elementos direto do seu script como no exemplo acima sem a necessidade de encher o HTML de marcações desnecessárias, tudo o que você vai precisar é de um id ou uma class, se você for atribuir o evento a um único elemento é altamente recomendado que se use o id caso ao contrario você pode usar um class(classe) mas será necessário o conhecimento em nodelist(um array com uma coleção de elementos).
Sintaxe:
O primeiro parâmetro é o evento que poderia ser qualquer um como o click, load, select entre tantos outros, isso você vai decidir.
O segundo parâmetro é a função que deve ser executada depois que o evento for gerado, pode ser criada uma função anônima ou pode ser passado o nome de uma função normalmente.
O terceiro parâmetro é um valor booleano e é opcional, o não uso dele não interfira o seu script.
/**função anonima**/
Ou
Para uma referencia mais completa recomendo que você leia a documentação da W3Schools:
- http://www.w3schools.com/js/js_htmldom_events.asp
- http://www.w3schools.com/js/js_htmldom_eventlistener.asp
preloadweb 