Upload
teresa-oliveira
View
315
Download
27
Embed Size (px)
DESCRIPTION
javascript
Citation preview
HTML: frames
JAVASCRIPT1O que Javascript?O JavaScript uma linguagem de scripting, orientada a objectos e independente de plataformasCriada pela NetScape Cdigo embebido em paginas HTMLUtilizada para:Interactividade nas pginas HTMLValidar formulrios Interpretada pelos Browsers2Javascript e JavaJavascript versus JavaA mesma coisa ou coisas diferentes?
PesquisaDiferena entre Javascript e Java
3Javascript JavaJava uma linguagem diferenteSo duas tcnicas diferentes de programao na Internet: Java uma linguagem de programao. JavaScript uma linguagem de scripting (tal como diz o nome). Embedida numa pgina web.4O que faz o Javascript?Cria um interface com o utilizador activo;Pode validar dados introduzidos em formulrios (form);Permite personalizar uma pgina HTML, com base: nos dados introduzidos, cookies, no dia de semana, na semana, da localizao, entre outras;Pode controlar os browsers (utilizador pode permitir ou no);
5Os acontecimentos tero por base os inputs do utilizador, participa no resultado da pgina. Pode introduzir dados e obter uma resposta.J experimentaram certamente de encomendar algo na internet.submeteram os dados e obtiveram um resposta do servidor que o seu nome tem caracteres no permitidos ou no pode ter espaos, etc.. Com o javascript isso no acontece, os dados no precisam de ir para o servidor. O que acontece que o cliente realiza parte desse trabalho;5Onde colocar o Javascript?Dentro do ficheiro HTMLComo evento de um elementoComo elemento SCRIPT dentro de BODYComo funo, dentro de HEAD
Num ficheiro externoPrefervel, pelas mesmas razes das CSS
6
Usando JavaScriptO uso de JavaScript deve ser definido da seguinte forma:
/* script */
JanelasExistem 3 tipos de janelas que podem ser usadas e que permitem a interao com o utilizador:alert (algumtexto) - Janela de alerta confirm (algumtexto) - Janela de confirmaoprompt (algumtexto,valorinicial) - Janela recolha dados
8 var num=prompt(Escreva um numero);Alert(Escreveu o nmero+num); Confirm(Est certo); Javascript: exemploO script abaixo l o nome do utlizador e d boas-vindas.
/* Script de Boas-Vindas */var NOME; NOME = window.prompt ("Entre com seu nome: " , "Digite-o aqui: "); document.write ("Oi " + NOME + " esteja a vontade" );
9Javascript: exemplo
var nomenome = window.prompt("Digite o seu
nome:");document.write("Bom dia, " + nome + "!
");document.write("tchau!!");
10Javascript: exemplo
Javascript
Em HTMLdocument.write(Agora em JavaScript");
11Exerccio prtico Cria uma pgina web que d como Output:
12Este a minha primeira pgina Web.Com Javascript, claro!JavaScriptVariveisdefiniox=3.14 var x=3.14
variveis definidas com var e sem valor atribudo tem valor undefined
As variveis so globais se definidas fora de uma funo, caso contrrio so variveis locais.
13JavaScriptTipos de dados Tipos de dados dinmicos var x=3.14var str=hello world var nomeTipos de dados primitivos nmeros (inteiros e reais)string (cadeia de caracteres)lgicos (true ou false)nullundefined
14OperadoresO JavaScript tem os seguintes operadores:
AritmticosStrings AfectaoComparaoLgicos (booleanos)OperadoresOperadores de afectaoEx: a+= 3 a = a+ 3 retorna 7 se a valer 4OperadorEquivalnciax += yx = x + yx -= yx = x - yx *= yx = x * yx /= yx = x / yx %= yx = x % yx ^= yx = x ^ yvariveis globais.
}
}
Ultima actualizao: 18-10-2011
FunesAs funes em JavaScript tm um nome e, em geral, tm argumentos e geram um valor.
function nome_de_funo (parametro1, parametro2, ... ) { declaraes de variaveis e instrues...}
As variveis declaradas dentro de uma funo s podem ser acedidas dentro da funo onde so declaradas.
A definio de uma funo consiste na palavra-chave function, seguida pelo seu nome, uma lista de argumentos - dentro de parntesis e separados por vrgulas - e as respectivas instrues, dentro de chavetas.Estruturas de DecisoDeciso Simples:If (condio){/*Instrues para condio verdadeira*/}
Deciso Composta:If (condio){/*Instrues para condio verdadeira*/}Else{/*Instrues para condio falsa*/}
Estruturas de Deciso - Operadores LgicosAtravs dos operadores lgicos podemos criar condies compostas. Exemplo:if (sexo==F && idade>= 18){ document.write (Mulher Maior de Idade);}
SmboloSignificado||Ou (OR)&&E (AND)!No (NOT)Estruturas de DecisoSeleo Sequencial
Para facilitar a interpretao do cdigo e evitar sequencias muito grandes de encadeamento de deciso, utilizamos o Switch... Case.
Exemplo:switch (mes){case 1: document.write(Janeiro); break;case 2:document.write(Fevereiro); break;......}Estruturas de Repetiowhile (condio) {cdigo a ser executado enquanto a condio for verdadeira; }
Var i=1; While (i 2004) alert ("erro")38JavaScript Dom (Document Object Model)
39JavaScriptJavaScript DOM window contm a informao sobre as janelas e framesdocumentcontm informao sobre o documento HTML e permite aceder aos elementos HTML dentro do documento navigatorContm informao sobre o browser do utilizadoreventContm informao sobre os eventos que ocorrem na pgina40JavaScriptJavaScript Windows e Frameswindow.alert(text) apresenta uma janela com o texto especificado como parmetroresult = window.confirm(text) apresenta uma janela de dilogo. result um valor booleano com valor true se foi premido o boto OK e false para o boto Cancelwindow.open("URL", "name" [, "windowfeatures"]) mtodo para criar uma nova janela. Devolve um objecto do tipo window. O name permite identificar a janela para ser utilizado no target. windowfeatures define propriedades da janela como altura, largura, toolbar
var winobj=window.open("btest2.html", "bwin", "toolbar,status");41JavaScripturl = window.location window.location = urlpropriedade para definir novo url da pgina ou saber url corrente
window.parentdevolve uma referncia para a janela (frame) pai da janela( frame) corrente.window.topdevolve uma referncia para a janela principal (ou frameset) numa hierarquia de janelasmsg = window.statuswindow.status = msg propriedade que permite alterar o texto na statusbar do browser.function getNews() { window.location= "http://www.cnn.com"; } no html: News 42JavaScriptwindows.history
devolve uma referncia para o objecto history que contm uma lista dos URL visitados. O mtodo go, back e forward deste objecto permite redireccionar o browser.h = window.history;if ( h.length ) { // if there is a history h.back(); // equivalent to clicking back button}windows.setTimeOut
window.setTimeout("tick();", 100);
Funo tick ser chamada ao fim de 100 ms
43JavaScriptJavaScript e Forms Cada form HTML num documento cria um objecto form Existe um array forms com as vrias forms de um documento.Acesso a um form em javascriptPor indice document.forms[0]
Por id/name document.myform //no html