Efeitos rápidos com Javascript

Antes de aprofundarmos na matéria, podemos ver uma série de efeitos rápidos que se podem programar com Javascript. Isto, pode nos dar uma ideia más clara e exata das capacidades e da potência da linguagem na hora de percorrer os próximos capítulos.

Abrir uma janela secundária

Primeiro vamos ver que com uma linha de Javascript podemos fazer coisas bastante atrativas. Por exemplo podemos ver como abrir uma janela secundária sem barras de menus que mostre o buscador Google. O código seria o seguinte:

<script> 
window.open("http://www.google.com","","width=550,height=420,menubar=no")
</script> 

Podemos ver o exemplo em funcionamento aqui.

Uma mensagem de boas vindas

Podemos mostrar uma caixa de texto emergente ao terminar de carregar o portal de nosso site web, que poderia dar as boas vindas aos visitantes.

<script> 
window.alert("Bem-vindo ao meu site web. Obrigado...") 
</script> 

Podemos ver o exemplo em uma página a parte.

Data atual

Vejamos agora um simples script para mostrar a data de hoje. Às vezes é muito interessante mostrá-la nas webs para dar um efeito de que a página está "ao dia", ou seja, está atualizada.

<script> document.write(new Date()) </script> 

Estas linhas deveriam ser introduzidas dentro do corpo da página no lugar onde quisermos que apareça a data da última atualização. Podemos ver o exemplo em funcionamento aqui.

Nota: Um detalhe a destacar é que a data aparece em um formato um pouco raro, indicando também a hora e outros atributos da mesma, mas já aprenderemos a obter exatamente o que desejarmos no formato correto.

Botão de voltar

Outro exemplo rápido pode ser visto a seguir. Trata-se de um botão para voltar para trás, como o que temos na barra de ferramentas do navegador. Agora veremos uma linha de código que mistura HTML e Javascript para criar este botão que mostra a página anterior no histórico, se é que havia.

<input type=button value=Atrás onclick="history.go(-1)">

O botão será parecido ao seguinte. Podemos clicá-lo para ver seu funcionamento (deveria nos levar à página anterior).

Como diferença com os exemplos anteriores, há que destacar que neste caso a instrução Javascript se encontra dentro de um atributo de HTML, onclick, que indica que essa instrução tem de ser executada como resposta ao clicar no botão.

É possível comprovar a facilidade com a qual se podem realizar algumas ações interessantes, e existiriam muitas outras mostras, mas que reservamos para capítulos posteriores.