Eventos em HTML sao "coisas"que acontecem com os elementos HTML. Quando o Javascript é utilizado em páginas HTML, ele pode "reagir"a esses eventos. Um evento HTML pode ser alguma coisa que o navegador faz, pode ser algo que o usuário faz. Veja a seguir alguns exemplos de eventos em HTML:
- Uma página HTML que acabou de carregar;
- Um campo de entrada HTMl que mudou de valor;
- Um botão HTML que foi pressionado.
document.querySelector(’html’).onclick = function() {
alert(’Ai! Não me cutuque!’);
}
Há muitas maneiras de conectar um evento com um elemento. Aqui o elemento HTML foi selecionado, atribuindo ao manipulador
onclick a uma função anônima, que contém o código que
queremos executar. Note que
document.querySelector(’html’).onclick = function() {};
é equivalente a
var myHTML = document.querySelector(’html’);
myHTML.onclick = function() {};
O HTML permite que atribitos de manipuladores de evento,m com código Javascript, sejam adicionados aos elementos HTML.
Com aspas simples:
<element event=’codigo JavaScript’>
Com aspas duplas:
<element event="codigo JavaScript»>
No exemplo seguinte, um atributo onclick (com código) é adicionado ao elemento but on em HTML:
<button onclick="document.getElementById(’demo’).innerHTML = Date()">Que horas são?</button>
No exemplo acima, o Javascriot muda o conteúdo do elemento com id="demo". No próximo exemplo, o código muda o conteúdo de seu próprio elemento (usando this.innerHTML):
<button onclick="this.innerHTML = Date()">Que horas são?</button>
O código JavaScript frequentemente tem várias linhas de código. É cada vez mais comum vermos atributos de eventos chamando funções:
<button onclick="displayDate()"> Que horas são?</button>
A seguir uma lista de alguns elementos HTML usuais:
Os manipuladores de evento podem ser utilizados para manipular e verificar a entrada de dados do usuário, ações do usuário e ações do navegador:
- Coisas que devem ser feitas toda vez que uma página é carregada;
- Coisas que devem ser feitas quando uma página é fechada;
- Ações que devem ser realizadas quando um usuário clica um botão;
- Conteúdo que deve ser verificado quando o usuário faz uma entrada de dados.
- E mais...
Nenhum comentário:
Postar um comentário