Evento onload de Javascript

Com o evento onload podemos executar ações justo quando terminem de se carregar todos os elementos da página.

O evento onload de Javascript se ativa quando termina de se carregar a página. Deve ser colocado na etiqueta <body>, embora em versões modernas de Javascript, também o aceitam outros elementos como as imagens.

Com o evento onload podemos executar ações justo quando terminem de se carregar todos os elementos da página. É um evento bastante utilizado, pois é muito habitual que seja desejado realizar ações nesse preciso instante. Em nosso exemplo, vamos ver como poderíamos fazer um script para motivar aos nossos visitantes que nos votem em um ranking qualquer de páginas web.

A idéia é que a página se carregue inteira e, uma vez estando carregada, apareça uma janela de Javascript onde se proponha ao visitante votar a página. É interessante esperar que termine de carregar a página inteira para que o visitante possa ver a web que se propõe votar, antes de realmente pedirmos seu voto.

O código seria o seguinte:

<html>
<head>
    <title>Vote-me!!</title>
<script language="JavaScript">
function pedirVoto(){
    if (confirm("Esta página está muito legal (como pode ser vista). Dê o seu voto!")){
       window.open("http://www.oquefor.com/votar.php?idvoto=12111","","")
    }
}
</script>
</head>

<body onload="pedirVoto()">
<h1>Página SuperLegal</h1>
<br>
Esta página está muito bonita. Sou o autor e posso garantir que não há muitas páginas com tanta qualidade na Internet
<br>
<br>
<a href="#">Entrar</a>

</body>
</html>

Observamos que na etiqueta <body> temos o evento onload="pedirVoto()". Ou seja, que quando se carregue a página se chamará a uma função chamada pedirVoto(), que definimos no bloco de script que temos no cabeçalho.

A função pedirVoto() utiliza uma caixa confirm para saber se realmente o usuário deseja nos votar. A função confirm() mostra uma caixa com um texto e dois botões, para aceitar ou cancelar. O texto é o que recebe por parâmetro. Dependendo do que se clique nos botões, a função confirm() devolverá um true, se se clicou o botão aceitar, ou um false, no caso de que se clicasse sobre cancelar.

A função confirm() está por sua vez colocada dentro de um bloco condicional if, de modo que, dependendo do que se clicou na caixa confirm, o if se avaliará como positivo ou negativo. Neste caso, somente realizam-se ações se se clicou sobre aceitar.

Para acessar à página onde se contabiliza nosso voto temos o método window.open(), que serve para abrir janelas secundarias ou popups. Mostramos a página onde se vota em uma janela secundária para que o visitante não saia de nosso web, já que acaba de entrar e não queremos que vá embora.

Com isto, fica mais ou menos ilustrado como fazer uso do evento onload. Com certeza haverá muitos mais casos onde utilizá-lo em suas criações.