Site hosted by Angelfire.com: Build your free website today!

JavaScript

TUTORIAL:

O que é JavaScript?

JavaScript é uma nova linguagem de programação de scripts para páginas da web. Scripts escritos em JavaScript podem ser colocados em suas páginas HTML. Com JavaScript você tem várias maneiras de melhorar sua página HTML com elementos interessantes. Por exemplo você é capaz de responder à eventos de usuario facilmente. Alguns efeitos que são agora possíveis com Javascript até bem pouco tempo atrás só eram possíveis através de CGI. Então você pode criar páginas realmente sofisticadas com a ajuda de JavaScript. Você pode ver exemplos de script para JavaScript na Internet. Melhor que você tem a fazer é olhar páginas com JavaScript. Você pode encontrar muitos links na Gamelan (na seção de JavaScript). Você irá encontrar documentação fornecida pela Netscape na http://home.netscape.com.
 

Qual é a diferença entre Java e JavaScript?

Apesar dos nomes serem quase os mesmos, Java não é a mesma coisa que JavaScript. Estas são duas diferentes tecnicas de programação para Internet. Java é uma linguagem de programação. Javascript é uma linguagem de encriptamento (como o nome já diz - script). A diferença é que você pode criar programas reais com Java. Mas frequentemente você so quer fazer um belo efeito sem ter que se chatear com programação real. Então JavaScript foi criado para ser fácil de ser entendido e de ser usado. Autores de JavaScript não precisam se ligar muito em programação.
Você pode dizer que JavaScript é somente uma extensão do HTML do que uma linguagem de programação separada. Naturalmente está não é a definição "oficial" mas eu acho que ela torna mas fácil de se entender a diferença entre Java e JavaScript. Você pode encontrar mais informações sobre ambos Java e JavaScript na Gamelan.

Para maiores informações sobre este tópico leia a introdução fornecida pela Netscape.
 
 

Como JavaScripts podem ser rodados?

O primeiro browser a dar suporte a JavaScript foi o Netscape Navigator 2.0. Naturalmente que as versões posteriores também aceitam JavaScript do mesmo modo. Você deve saber que Java não roda em todos os Netscapes 2.0 ou superiores. Mas não é verdade para JavaScript - apesar de haver alguns problemas com diversas versões. A versão para Mac por exmplo aparenta ter vários defeitos. O Microsoft Internet Explorer 3.0 já suporta o JavaScript - apesar de também ter alguns defeitos. Você também deve perceber que é realmente fácil escrever em JavaScript. Tudo que você tem que saber são algumas técnicas básicas e algum trabalho - acerca de alguns problemas que você poderá encontrar.
É lógico que você precisa de um conhecimento básico de HTML antes de ler este tutorial. Você pode encontrar muitas fontes de recursos sobre HTML na internet. Nesta homepage você tem um tutorial básico de HTML por exemplo. O Melhor que você pode fazer é fazer uma procura online sobre "html" no Yahoo se você quer se informar mais sobre HTML. (Estes documentos online sobre HTML são mais frequentemente atualizados que livros por causa da velocidade do aumento de informações na Internet.)
 
 

Agora eu quero te mostrar alguns pequenos scripts pra você aprender como eles estão implementados nos documentos HTML e mostraras possibilidades que você tem com a nova linguagem de scripts. Eu irei começar com um script bem pequeno o qualirá apenas inserir um texto no documento HTML.

<html>
<head>
Meu Primeiro JavaScript!
</head>
<body>
<br>
Este é um documento normal de HTML.
<br>
<script language="JavaScript">

document.write("Isto é JavaScript!")

</script>
<br>
De volta ao HTML.
</body>
</html>

Se você está usando um browser que suport JavaScript então você terá a possibilidade de ver este script funcionando. Se o seu browser não suporta JavaScript então o que vai sair vai aparentar uma coisa meia estranha :)

Este é um documento normal de HTML.
Isto é JavaScript!
De volta ao HTML.

Eu devo admitir que este script não é muito legal. Você pode escrever aquilo em HTML mais rápido e curto. Mas o que eu quis mostrar é como você tem que usar as tags <script>. Você pode usar estas tags no seu documento sempre que você quiser.
 
 

Eu não quero te perturbar com esses scripts idiotas. Então nós iremos passar às funções. Elas não são diíceis de se entender mas, acredite em mim, são muito mais úteis! As funções precisam estar colocadas entre as tags <head> de sua página HTML. Funções são chamadas de eventos iniciadas pelo usuário. Então parece ser rasoável manter as funções entre as tags <head>. Elas são carregadas primeiro e um usuário pode fazer o que quiser e chama-la de função. Scripts podem ser colocados entre campos de comentarios para ter certeza que os browsers mais anyigos não iram mostrar o próprio script.

<html>
<head>
<script language="JavaScript">

function pushbutton() {
alert("Ola!");

}

</script>
</head>
<body>

<form>
<input type="button" name="Button1" value="Aperte" onclick="pushbutton()">
</form>
</body>
</html>

Se você quer testar este imediatamente e se você estiver usando um browser que aceite JavaScript então vá em frente e aperte o botão.
 
 

Este script irá criar um botão e quando você apertá-lo uma janela irá aparecer uma janela popup dizendo "Ola". Não é ótimo? Então, o que acontece neste script? Primeiramente a função é carregada e mantida na memória. Então um botão é criado com a tag <form> normalmente (HTML). Existe algo que é de certa forma novo com a tag <input> Aqui você pode ver o 'onclick'.
Isto diz ao browser qual função chamar quando este botão é pressionado (é claro, somente se o browser der suporte a JavaScript). A função 'pushbutton()' está declarada no cabeçalho. Quando o botão é pressionado esta função é executada. Outra coisa nova neste script é o método 'alert'. Este método já está declarado no JavaScript - então tudo que você tem que fazer é chamá-lo. Existem muitos métodos diferentes os quais você pode chamar. Eu lhes mostrarei alguns aqui mas você pode encontrar uma descrição completa no site da Netscape. Eu acho que esta lista iráse tornar bem maior num futuro próximo. Mas por enquanto, já existem algumas coisas interessantes que nos podemos fazer com os métodos dados. (Eu não acho que o método 'alert' seja difícil de ser usado deste modo - mas nós estamos somente aprendendo. E, desta maneira, é uma modo fácil de ser aprendido. Eu espero que você me desculpe por qualquer coisa...)
 
 

Nós agora já estamos chegando longe. De fato, nós temos um monte de possibilidades somente por acrescentarmos as funções aos nossos scripts. Agora eu irei demonstrar como você pode ler alguma coisa que alguem colocou num formulário.

<html>
<head>
<script language="JavaScript">
<!-- hide script from old browsers

function getname(str) {

alert("Oi, "+ str+"!");

}

// end hiding contents -->

</script>
</head>
<body>
Por favor digite seu nome:
<form>

<input type="text" name="name" onBlur="getname(this.value)" value="">

</form>
</body>
</html>

Agora você pode testar o script novamente:

Por favor digite seu nome:
 
 

Nós temos alguns novos elementos implementados neste script novamente. Primeiramente você tem que colocar o comentário no scipt. Deste modo você pode esconder o script dos browsers antigos - que não conseguem rodar scripts. Você tem que mante-los na ordem certa de apresentação! O começo do comentário precisa ser logo após a primeira tag <script>. O comentário termina antes do </script>. Neste documento HTML voce tem que por um formulário onde um usuário pode por o nome dele. O 'onBlur' na tag <input> diz ao cliente qual função ele tem que chamar quando algo é inserido no formulário. A função 'getname(str)' será chamada quando você deixar esse elemento doformulário ou pressionar enter depois de inserir alguma coisa. A função irá pegar o valor que você inseriu através do comando 'getname(this.value)'. 'This.value' significa o valor que você digitou dentro do formulário.
 
 

Eu acho que a próxima coisa é tão boa quanto as outras. Nós iremos implementar uma função de data dentro do nosso script. Então, se você criar uma página HTML você pode fazer com que o cliente insira a data da última modificação do documento. Você não terá que escrever a data no documento. Você simplesmente irá escrever um pequeno programa script. Quando você fizer alguma alteraçãono futuro, a data irá mudar automaticamente.

<html>
<body>
Esta é uma página de HTML.
<br>
Última modificação:
<script language="JavaScript">
<!-- hide script from old browsers

document.write(document.lastModified)

// end hiding contents -->
</script>
</body>
</html>

No momento esta pripriedade parece não funcionar em todas as máquinas. Alguns servidores só mostram a data 1/1/1970. Aparentam existirem alguns problemas com esta função. Nós teremos que esperar pela próxima atualização para que ela funcione em toda máquina. Mas você pode testar em sua própria máquina - em algumas funciona perfeitamente.

Como eu já disse, a coisas estão se atualizando realmente rápido hoje em dia. Então não seria inacreditável se na próxima semana houvesse uma mudança maior no JavaScript! Então você terá sempre que pesquisar por novas mudanças ja que esta é uma linguagem nova. Por favor entenda que algumas ditas aqui já podem ter mudado do mesmo modo. Mas eu acho que os princípis básicos irão permanecer os mesmos.