Java Script

Pg: 1

ndice ndice ...................................................................................................................................... 1 Introduo ao JavaScript Bsico............................................................................................. 2 Configuraes ......................................................................................................................... 2 Usando o Java Script. ............................................................................................................. 2 Comandos: script language - alert - /script............................................................................ 3 Variveis ................................................................................................................................. 4 Regras para criar uma varivel: .............................................................................................. 4 Comandos: Window.prompt - alert com varivel ............................................................... 5 Comandos ............................................................................................................................... 6 1. document.write( escreva sua informao ); .................................................................... 6 2. document.bgColor= cor em ingls; ............................................................................. 7 3. document.fgColor= cor em ingls; ............................................................................. 7 4. document.title=Ttulo da pgina; ................................................................................ 7 5. document.write (document.lastModified); ..................................................................... 7 6. window.open("URL","nome_da_janela","Parmetros"); ............................................... 7 7. window.location.ref="nome e estenso da outra pgina "; ............................................ 8 8. window.location.reload();............................................................................................... 8 9. window.close( ); ............................................................................................................. 8 10. window.status= ... mensagem ...; ........................................................................... 8 Eventos ................................................................................................................................... 9 Objetos de Formulrio ............................................................................................................ 9 1-) Boto de comando: ........................................................................................................... 9 2-)Boto de radio: ................................................................................................................. 10 3-)Caixa de verificao:........................................................................................................ 10 4-)Caixa de Texto: ................................................................................................................ 10 Operadores do JavaScript ..................................................................................................... 11 Comandos: if e if ..else ...................................................................................................... 13 Comando case ....................................................................................................................... 13 Laos de Repetio em JavaScript ....................................................................................... 14 1-) Estrutura for .................................................................................................................... 14 2-) Estrutura while ................................................................................................................ 15 3-) Estrutura do..while .......................................................................................................... 16 Funes ................................................................................................................................. 16 Funo simples ..................................................................................................................... 16 Funo com parmetro ......................................................................................................... 17 Clculos em JavaScript......................................................................................................... 18 Uso de uma funo de converso ......................................................................................... 20

Fonte de pesquisa site eadcetec.kit.net/javascript APOSTILA ELABORADA atravs da pesquisa feita no endereo acima pela professora Marli H.G.Cazarin El Kadre

Java Script Introduo ao JavaScript Bsico

Pg: 2

Javascript linguagem de script para construo de pginas da Web utilizando recursos dinmicos. Podemos criar efeitos especiais, controlar os dados digitados em um formulrio e criar algumas animaes. A construo de uma pgina usando Java, deve ser desenvolvida junto com HTML

Configuraes
Antes de iniciar o curso, preciso verificar se o seu navegador est configurado para executar os scripts em Javascript. Com a internet aberta, clique no menu ferramentas Clique na opo: opes da internet

Na guia avanado alterar o item Java VM, ticando toda as 3 opes, como mostra a figura abaixo:

Usando o Java Script.

O cdigo em Javascript poder ser inserido em qualquer ponto de sua pgina, desde que dentro das tags <html>..</html> e iniciando-se com a tag <script language = Javascript> e terminando com a tag </script>. Exemplos:

<script language="Javascript">

tag para indicar o incio da codificao JAVA Script

Java Script

Pg: 3

........ cdigo scripts </script> </head> <body> Corpo da pgina </body> </html>
Codificao normal do HTML tag para indicar o fim da codificao JAVA Script

<html><head><title>Programando em Javascript - aula 1</title>

</head> <body> <script language="Javascript"> ........ cdigo scripts </script> </body> </html> cdigo em JAVA entre as tags
<body> .... </body>

OBS.1

Como o HTML, uma pgina usando JAVA SCRIPT, deve ser digitada em um editor de texto, pode ser o BLOCO DE NOTAS e salvar com a extenso HTML ou HTM

Comandos: script language - alert - /script 1. <script language="Javascript"> Comando para informar o navegador qual
a linguagem de scripts que dever ser interpretada. 2. alert(" ..... escreva sua mensagem aqui ...."); Esta funo exibi uma caixa de dilogo com a mensagem que est entre aspas no final da instruo usa-se ponto-e-vrgula (;) para indicar ao navegador o final de instruo. Tambm pode ser escrito usando o comando window antes de alert. Ex:

Java Script
window.alert("..... escreva sua mensagem aqui ....");

Pg: 4

3. </script> Comando para finalizar o bloco de instrues em Javascript. Exerccio 1 Criar uma pgina usando o comando alert para desejar um Bom Dia.

<html> <head><title>exerccio n 1 </title></head> <script language="Javascript"> alert("Bom dia? Tudo Bem?"); </script> <body> Primeiro exerccio em JAVA SCRIPT </body> </html>

Resultado

Variveis
As variveis permitem guardar dados na memria da mquina durante a execuo de programas, pginas ou scripts. Sempre que forem usadas elas estaro prontas para entrarem em ao e receber ou enviar dados conforme a solicitao do usurio.

Regras para criar uma varivel:

1. Um nome de varivel deve sempre comear por uma letra 2. No utilize smbolos especiais tais como:(! @ # $ % ^ & * : ; " ', . / ? + = ~`) 3. Procure escrever os nomes das variveis sempre em minsculo uma vez que Javascript sensvel a letras maisculas e minsculas 4. Procure dar nomes as variveis que lembrem o seu contedo Para declarar uma varivel em Javascript, voc poder utilizar ou no a denominao var (sempre em letras minsculas), no preciso especificar o tipo de varivel. Se criar uma varivel e atribuir um contedo texto e na linha seguinte atribuir um contedo numrico, o prprio navegador interpreta a instruo e converte normalmente sem nenhum problema.

Java Script
Exemplo-1 var nome="ETE Silvio de Mattos Carvalho"; nome="ETE Silvio de Mattos Carvalho";

Pg: 5

As duas declaraes so iguais

Comandos: Window.prompt - alert com varivel

1. varivel=window.prompt("mensagens para entrada de dados", "ttulo"); Comando para entrada de dados, usando uma varivel que deve ser previamente declarada. Pode ser escrito omitindo-se a palavra window. Ex: varivel=prompt("mensagens para entrada de dados", " "); 2. alert("Mensagem "+nome da varivel+" continuao da mensagem"); Comando para mostrar uma pesagem utllizando uma varivel. A varivel pode vir em qualquer parte da mensagem, sempre entre aspas e com os sinais de + no incio e fim. Exerccio. Escreva um cdigo em Javascript para permitir a entrada de um nome em uma varivel e depois exibi-lo em uma caixa de dilogo.

<html> <head><title>exerccio usando varivel</title></head> <script language="Javascript"> var nome=window.prompt("Digite seu nome.","Nome"); alert("Ol "+nome+" Seja Bem Vindo !!!"); </script> <body> Primeiro exerccio em JAVA SCRIPT </body> </html>
Resultado

Java Script

Pg: 6

Comandos

1. document.write( escreva sua informao );

Este comando permite escrever qualquer informao na pgina que pode ser um texto ou o contedo de uma varivel de memria. Ex: document.write("Programando em Javascript"); document.write("Ol "+nome+" Seja Bem Vindo !!!");

Java Script 2. document.bgColor= cor em ingls;

Este comando altera a cor de fundo da pgina. Ex: document.bgColor="pink";

Pg: 7

3. document.fgColor= cor em ingls;

Este comando altera a cor da letra na pgina. Ex: document.fgColor="blue;

4. document.title=Ttulo da pgina;
Define um ttulo para a pgina. Ex: document.title="Curso de Informtica";

5. document.write (document.lastModified);
Exibe a data da ltima atualizao da pgina. Ex: document.write(document.lastModified);

6. window.open("URL","nome_da_janela","Parmetros");
Comando para abrir uma pgina em uma nova janela, alm de controlar sua posio, tamanho e os controles que devero aparecer na nova janela. Ex: window.open("URL","nome_da_janela","Parmetros"); URL : o endereo da pgina a ser aberta nome_da_janela : um nome dado a nova janela a ser aberta que mais tarde poder ser referenciada em cdigo, usando o atributo target. Parmetros: para colocar os controles de janela que devero ser exibidos. So eles: a) status (barra de status): possui dois valores yes(habilita a exibio) e no(desabilita a exibio) b) location (barra de endereo) : possui dois valores yes(habilita a exibio) e no(desabilita a exibio)

Java Script

Pg: 8
c) toolbar (barra de ferramentas) : possui dois valores yes(habilita a exibio) e no(desabilita a exibio) d) menubar (barra de menus) : possui dois valores yes(habilita a exibio) e no(desabilita a exibio) e) scrollsbars (barra de rolagem) : possui dois valores yes(habilita a exibio) e no(desabilita a exibio) f) left e screenX : definem a posio em pixels da janela a ser aberta a partir do lado esquerdo da janela do navegador. O left utilizado no Internet Explorer e o screenX no Netscape. g) top e screenY: definem a posio em pixels da janela a ser aberta a partir do aldo de cima da janela do navegador. O top utilizado no Internet Explorer e o screenY no Netscape. h) height (altura) : Controla a altura da nova janela. Este valor dever ser informado em pixels. i) width (largura) : Controla a largura da nova janela. Este valor dever ser informado em pixels.

7. window.location.ref="nome e estenso da outra pgina ";

Comando para redirecionar o internauta para outra url (pgina). Ex: window.location.ref="exec1.html";

8. window.location.reload();
Este comando serve para atualizar a pgina atual no navegador. como se voc pressionasse a tecla F5 ou clicar no menu exibir e selecionar atualizar. Ex: window.location.reload();

9. window.close( );
Este comando fecha a pgina atual que est aberta no navegador e ao fechar ser exibida uma caixa de dilogo do Internet Explorer pedindo para confirmar o fechamento da pgina.

10. window.status= ... mensagem ...;

Com este comando, voc pode exibir qualquer mensagem na barra de status do navegador. Ex: window.status="Programao em Javascript"; Exerccio: Fazer vrias pginas usando todos os comandos. Procure agrupar vrios comandos em uma nica pgina.

Java Script Eventos

Pg: 9

Eventos so acontecimentos que ocorrem durante a navegao em uma pgina da web. Em Javascript existem basicamente dois tipos de eventos Eventos de Sistemas e Eventos de Mouse 1-) Eventos de Sistemas: So os que entram am ao automaticamente sem a interveno do internauta. Temos: onLoad (ao carregar) e onUnload (ao descarregar) que so escritos na tag <body> . Ex: <html><head><title>Eventos em Java Script </title></head> <body onload="alert('a pgina est sendo carregada .... Seja Bem Vindo!!!')" onUnload = "alert('At mais volte sempre.....')"> </body> </html>

2-) Eventos de Mouse: So aqueles que acionam aes mediante o uso do mouse, abaixo uma relao dos eventos de mouse:

onClick : Ocorre quando o boto do mouse for clicado onDblclick: Ocorre quando o boto do mouse sofrer um clique duplo onmouseMove: Ocorre quando o ponteiro do mouse passar sobre o objeto onmouseOver: Ocorre quando o ponteiro do mouse ficar acima do objeto onmouseOut: Ocorre quando voc retirar o ponteiro do mouse do objeto onSubmit: Ocorre quando o internauta clica no boto enviar com objetos de formulrios onFocus: Ocorre quando um objeto ganhar o focu com o click do mouse ou o uso da tecla TAB onChange : Ocorre quando o contudo de uma caixa de texto for alterado

Objetos de Formulrio
Os objetos de formulrio permite a construo de pginas com botes de comando, botes de rdio, caixa de texto, caixa de seleo, para construo de um formulrio para enviar dados a um destinatrio. Para construir um formulrio todas as tags devero ser escritas entre as tag <form> ....... </form>.

1-) Boto de comando:

<html> <head><title>boto</title></head> <form> <input type="button" name="bt1" value="Clique no boto" onclick="alert('Voc clicou no boto')"> </form> </html>

input type="button" name="bt1"

boto do tipo alto relevo

nome do boto, pode ser qualquer um, desde que no seja repetido. rtulo do boto

value="Clique no boto" onclick

evento, ao clicar no boto o comando alert ser executado

Java Script 2-)Boto de radio:

Pg: 10

<html> <head><title>boto</title></head> <form> <input type="radio" name="opt1" onclick="alert('Voc clicou no boto')">Clique na opo </form>

input type="radio"

boto do tipo boto de opo

Observe que a frase Clique na opo foi colocada fora da tag input

3-)Caixa de verificao:
<html> <head><title>boto</title></head> <form> <input type="checkbox" name="chk1" onclick="alert('Voc clicou no boto')">Clique na opo </form>

input type="checkbox"

boto do tipo caixa de checagem

4-)Caixa de Texto:
<html> <head><title>boto</title></head> <form> <input type="text" name="texto1" size="35" maxlength="35" value="Curso de Javascript" onChange="alert('Voc alterou o contedo')"> </form> </html> caixa de texto

input type="text" size = 35

tamanho da caixa de texto em caracteres quantidade mxima de caracteres que podem ser escritos na

maxlenght = 35 caixa de texto. OnChange=......

evento quanto modificar o contedo da caixa de texto.

Exemplo: Vamos criar um script que permita ao internauta escolher atravs de um clique no boto uma cor de fundo para sua pgina. <html> <head><title>boto</title></head>

Java Script

Pg: 11

<form> <body> <align="center"><br><h3> Clique em um dos botes para alterar a cor de sua pgina</h3> <input type="button" name="btazul" value="Azul" onclick="document.bgColor=('blue')">&nbsp&nbsp <input type="button" name="btvermelho" value="vermelho" onclick="document.bgColor=('red')">&nbsp&nbsp <input type="button" name="btverde" value="verde" onclick="document.bgColor=('green')">&nbsp&nbsp <input type="button" name="btamarelo" value="amarelo" onclick="document.bgColor=('yellow')">&nbsp&nbsp <input type="button" name="btamareloouro" value="amarelo ouro" onclick="document.bgColor=('gold')">&nbsp&nbsp <input type="button" name="btazulclaro" value="Azul claro" onclick="document.bgColor=('cyan')">&nbsp&nbsp <input type="button" name="btverde claro" value="verde claro" onclick="document.bgColor=('lime')">&nbsp&nbsp </form> </script> </body> </html>

resultado

&nbsp

Este comando serve para colocar um espao entre os botes.

Exerccio 1 Crie um script igual ao exemplo, usando no lugar do button o radio 2 Crie um script para mudar a cor da pgina e mudar a cor da letra use o button e o radio.

Operadores do JavaScript
Os operadores permitem realizar clculos, comparaes e atribuir valores as variveis de memria, durante o acesso a pgina. 1-) Operadores Aritmticos : Servem para realizar clculos matemticos.

Java Script
Operador + * / % ++ -Descrio Adio Subtrao Multiplicao Diviso Mdulo(Resto diviso inteira) Incremento Decremento da Exemplo 1+5 20-15 5*3 12/6 12%6 x=5 x++ x=5 x-Resultado 6 5 15 2 0 x=6 x=4

Pg: 12

2-) Operadores de atribuio: Servem para guardar informaes nas variveis de memria. Operador += -= *= /= %= Exemplo x+=y x-=y x*=y x/=y x%=y Significado x=x+y x=x-y x=x*y x=x/y x=x%y

3-) Operadores de comparao: Servem para comparar contedos de variveis de memria.

Operador == != > >= < <=

Significado igual a diferente de maior que maior ou igual a menor que menor ou igual a

Exemplo 15= =15 verdadeiro 15!=15 falso 15>13 verdadeiro 15>=13 verdadeiro 10<20 verdadeiro 13<=35 verdadeiro

4-) Operadores lgicos: Servem para criar um expresso com mais de dois valores para serem comparados. Operador && || Significado E OU Exemplo x=10 e y=5 (x=10)&& verdadeiro (y<10)

(x=10)||(y=10) verdadeiro

Java Script
! NO x!=y verdadeiro

Pg: 13

Comandos: if e if ..else
A instruo if uma das mais importantes em JavaScript , atravs dela que podemos utilizar o conjunto dos operadores de comparao e determinar um novo curso para seu programa. 1-) Estrutura simples if (condio){ Bloco de comandos; }

Exemplo: Considere a=10 e b=20 if ( a<=b){ alert("O valor da varivel a menor que b"); }

2-) Estrutura composta if (condio){ Bloco de comandos verndade; } else{ Bloco de comandos falso; }

Exemplo : Considere a=30 e b=20 if ( a>=b){ alert("O valor da varivel a menor que b"); } else{ alert("O valor da varivel b menor que a"); }

Comando case
um comando de seleo onde durante a execuo do script ele visa encontrar a igualdade. Sintaxe: switch (varivel){ case 'valor 1': { bloco de comandos; break;} case 'valor2: {bloco de comandos;

Java Script
break;} default:{ comando alternativo;} }

Pg: 14

Exemplo <html> <head><title>Uso co comando switch em Javascrit</title> </head> <script language="Javascript"> var mes=window.prompt("Digite um valor entre 1-12",""); switch(mes){ case'1':{alert('Este nmero digitado corresponde ao ms de JANEIRO'); break;} case'2':{alert('Este nmero digitado corresponde ao ms de FEVEREIRO'); break} case'3':{alert('Este nmero digitado corresponde ao ms de MARO'); break;} case'4':{alert('Este nmero digitado corresponde ao ms de ABRIL'); break;} case'5':{alert('Este nmero digitado corresponde ao ms de MAIO'); break;} case'6':{alert('Este nmero digitado corresponde ao ms de JUNHO'); break;} case'7':{alert('Este nmero digitado corresponde ao ms de JULHO'); break;} case'8':{alert('Este nmero digitado corresponde ao ms de AGOSTO'); break;} case'9':{alert('Este nmero digitado corresponde ao ms de SETEMBRO'); break;} case'10':{alert('Este nmero digitado corresponde ao ms de OUTUBRO'); break;} case'11':{alert('Este nmero digitado corresponde ao ms de NOVEMBRO'); break;} case'12':{alert('Este nmero digitado corresponde ao ms de DEZEMBRO'); break;} default: case'1':{alert('Este nmero digitado no corresponde a nenhum ms');} } </script> </html>

Laos de Repetio em JavaScript

Temos 3 tipos de estrutura de repetio que servem para executar um script vrias vezes.

1-) Estrutura for

Supondo que devemos imprimir dez vezes o nome ETE Silvio de Mattos Carvalho. Os cdigos em Java so: <html><head><title>Lao de repetio for</title></head>

Java Script
<script language="Javascript"> for(i=1;i<11;i++){ document.write(i+" ETE Silvio de Mattos Carvalho"+"<br>");} </script> </html>

Pg: 15

A estrutura for composta de trs partes: (inicializao da varivel ; teste condicional e incremento da varivel) assim no exemplo acima a varivel i iniciada com o valor 1. Logo em seguida o teste i<11, isto quer dizer que o lao se repetir at que o valor da varivel i atingir 11. Por fim o incremento a varivel i i++ ( igual a i=i+1).

Resultado

2-) Estrutura while

A estrutura while faz a mesma coisa que o for, porm a varivel de controle do lao deve ser iniciada antes da instruo while. Veja a colocao no cdigo abaixo: <html><head><title>Lao de repetio fo</title></head> <script language="Javascript"> var i=1; while(i<11){ document.write(i+" ETE Silvio de Mattos Carvalho"+"<br>"); i++;} </script> </html>

Java Script 3-) Estrutura do..while

Pg: 16

A estrutura do.. while faz a mesma coisa que as outras duas anteriores, porm alm da varivel de controle do lao ser iniciada antes da instruo do..while, a repetio executada pelo menos uma vez antes da verificao do teste condicional.Veja a colocao no cdigo abaixo:

<html><head><title>Lao de repetio fo</title></head> <script language="Javascript"> var i=1; do{ document.write(i+" ETE Silvio de Mattos Carvalho"+"<br>"); i++;} while(i<11); </script> <html>

Exerccios

Desenvolver uma pgina que contenha cdigo em Javascript que exiba os nmeros de 1 a 15 sucessivamente. Salve com o nome de conta.htm e depois abra no seu navegador. Agora altere o cdigo e faa a impresso na tela em ordem decrescente , ou seja, de 15 a 1. Salve este arquivo com o nome de contadesc.htm

Funes
Uma funo uma rotina com vrios comando desenvolvida pelo programador que fica dispostos de uma forma lgica para chegar a um resultado desejado.

Funo simples
O exemplo abaixo mostra uma funo para digitar um nome e mostra-lo 10 vezes, a fun co executada no evento onclick. <html><head><title>Funes de Usurio em JavaScript</title></head> <script language="Javascript"> function entra(){ var i; var nome=window.prompt("Digite um Nome", ""); for (i=1;i<11;i++){ document.write(nome,"<br>");} } </script>

Java Script
<body> <center><input type="button" name="bt1" value="Clique" onclick="entra()"> &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp <input type="button" name="bt2" value="Fechar" onclick="window.close()"> </center> </body> </html> Detalhes do cdigo

Pg: 17

onclick="entra()" faz a chamada da funo no instante que o ponteiro do mouse for posicionado sobre o boto e efetuar o click. A funo comea com a palavra FUNCTION e termina com } ela abre uma caixa de dilogo e aguarda a digitao de um nome. Depois a informao armazenada na varivel nome. Logo em seguida um lao de repetio iniciado, imprimindo na pgina dez vezes o nome digitado atravs do comando document.write( ). Dentro deste comando existe a varivel nome e depois o cdigo em HTML que realiza a quebra de linha <br> Aps a execuo do exemplo, clique no boto voltar do navegador e depois no boto fechar da pgina que exibida e confirme seu fechamento.

Funo com parmetro

Quando trabalhamos com parmetros, significa chamar a funo e enviar um valor que possa ser recebido na funo solicitada. Em alguns casos precisamos de uma informao para depois completar a execuo de uma funo. Veja o exemplo abaixo: <html><head><title>Funes de Usurio em JavaScript com parmentros</title> <script language="Javascript"> function entra(recebe){ var i; for (i=1;i<11;i++){ document.write(recebe,"<br>");} } </script> </head> <body> <center><input type="button" name="bt1" value="Clique" onclick="entra('Curso de Javascript')"> &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp <input type="button" name="bt2" value="Fechar" onclick="window.close()"> </center> </body> </html> Detalhes do cdigo

Java Script

Pg: 18

onclick="entra('Curso de Javascript')" refere-se a chamada da funo entra, porm com o parmentro 'Curso de Javascript' que ser enviado para a funo chamada. Na funo chamada function entra(recebe) , existe uma varivel de nome recebe que guarda o valor passado como parmetro. Logo em seguida um lao de repetio iniciado, imprimindo na pgina dez vezes o contedo da varivel recebe atravs do comando document.write( ). Dentro deste comando existe a varivel recebe e depois o cdigo em HTML que realiza a quebra de linha <br> Aps a execuo do exemplo, clique no boto voltar do navegador e depois no boto fechar da pgina que exibida e confirme seu fechamento.

Clculos em JavaScript
Em Javascript possvel realizar clculos, basta para isto entender que necessrio o uso de uma funo que converta um alfanumrico em um nmero inteiro, assim o clculo ser efetuado 1-) Alfanumrico: Imagine uma operao para somar dois nmeros. "10"+"10"= 1010 observe as aspas, isto quer dizer que os nmeros so alfanumricos e portanto foram concatenados(unidos) um ao outro. Veja o cdigo abaixo: <html><head><title>Cculo entre dois afanumricos</title> </head> <script language="Javascript"> var n1='10'; var n2='10'; total=n1+n2; alert("O Resultado da operao com alfanumrico -> "+ total); </script> </html> Resultado do script

Java Script

Pg: 19

2-) Numrico: Agora para realizar uma operao preciso utilizar uma varivel que guarde este valor entre duas variveis total=10+10 o resultado da varivel 20. Veja o cdigo abaixo: <html><head><title>Cculo entre dois afanumricos</title> </head> <script language="Javascript"> var n1=10; var n2=10; total=n1+n2; alert("O Resultado da operao com alfanumrico -> "+ total); </script> </html> Resultado do script.

Java Script Uso de uma funo de converso

Pg: 20

Vamos supor que desejamos digitar os dados em duas caixas de textos distintas e depois clicar em um boto que faa o clculo. Ser necessrio o uso de uma funo matemtica que converta os alfanumricos em inteiro. Faremos um script para criar a pgina mostrada abaixo:

Listagem do cdigo completo <htm><head><title>Clculos entre objeto de Texto</title> </head> <script language="Javascript"> function operacao(){ var a=eval(document.formcalc.t1.value); var b=eval(document.formcalc.t2.value); var c=a+b; alert("O Resultado da operao -> "+c); } </script> <body> <form name="formcalc"> <h3><center>Clculo em JavaScript</h3> Digite o primeiro nmero:<input type="text" name="t1" size="4" maxlenght="4"> <br><br> Digite o segundo nmero:<input type="text" name="t2" size="4" maxlenght="4"> <br><br><hr><br><br> <input type="button" name="bt1" value="Calcular" onclick="operacao()"> &nbsp&nbsp <input type="reset" name="bt2" value="Cancelar" onclick="document.formcalc.t1.focus()">

Java Script
&nbsp&nbsp <input type="button" name="bt3" value="Fechar" onclick="window.close()"></center> </form></body></html> Detalhes do Cdigo 1-) Cdigo em Javascript <script language="Javascript"> function operacao(){ var a=eval(document.formcalc.t1.value); var b=eval(document.formcalc.t2.value); var c=a+b; alert("O Resultado da operao -> "+c); } </script>

Pg: 21

Definio da funo com o nome de operacao e logo em seguida as duas linhas para capturar os valores digitados nas caixas de textos converte-los atravs da funo eval( ) .. Em seguida realizado o clculo para adio guardando o resultado na varivel c e exibido na caixa de sada com o comando alert( ) 2-) Chamada da funo calculo( ) em Javascript onclick="operacao()" Esta instruo simples, pois foi usado o evento de mouse e feita a meno ao nome de uma funo j citada no cdigo em Javascript.Observe o detalhe das letras minscula pois como j sabe se colocar acentos ou digitar qualquer letra em mausculo a funo no ser localizada. 3-) Limpando o dados digitados <input type="reset" name="bt2" value="Cancelar" onclick="document.formcalc.t1.focus()"> Esta linha o reset representa recomeo e mais adiante a instruo localiza o formulrio(formcalc) e depois a primeira caixa de texto chamada aqui de (t1). Por ltimo o comando (focus( )) se encarrega de fazer o cursor ficar piscando nesta caixa caso o internauta queira digitar outro nmero. 4-) Fechando a Janela <input type="button" name="bt3" value="Fechar" onclick="window.close()"> A instruo (onclick="window.close()") executa o fechamento da janela aps o clique do mouse.