Introdução à Linguagem JavaScript. Rodolfo Riyoei Goya

Save this PDF as:
 WORD  PNG  TXT  JPG

Tamanho: px
Começar a partir da página:

Download "Introdução à Linguagem JavaScript. Rodolfo Riyoei Goya"

Transcrição

1 Introdução à Linguagem JavaScript Rodolfo Riyoei Goya

2 1 Índice 1 Índice Introdução Pré-requisitos Como funciona um script em JavaScript Um script simples em JavaScript Tipos de Dados Básicos Números (Number) String Caracteres de Controle Especiais Boolean Criando Variáveis Comandos Operadores Aritméticos Atribuição Atribuição Aritmética Incremento e decremento Operador para troca de sinal Operadores + e += aplicados a String Operadores Relacionais Operadores Lógicos Precedência de operadores Entrada/Saída em JavaScript Função write Mensagens Alert Confirm Prompt Comandos de Controle Comando if Comando if-else Comando switch-case Atribuição Condicional Comando for Comando while Comando do-while Comandos break e continue Funções Variáveis em funções Funções sem parâmetros Funções que retornam valores Funções Intrínsecas Funções Matemáticas Funções de manipulação de Strings Classes, Objetos e Arrays em Javascript Criando Objetos Criando Funções para Classes Criando Atributos Dinamicamente Manipulando Arrays de 61

3 8.5 Objeto para Manipulação de Datas Interface com o Usuário Objeto Input: Text Objeto Input Password Objeto Input: Hidden Objeto Input: Checkbox Objeto Input: Radio Objeto Input: Button Objeto Input: Reset Objeto Input: Submit Objeto TextArea Objeto Select Objeto Link Eventos Focando um Objeto Classe Timer Abrindo Novas Janelas Abrindo a Janela Abrindo um Documento Escrevendo no Documento Fechando a Janela Fechando o Documento Propriedades de um Documento de 61

4 2 Introdução Este texto se destina a aqueles que desejam aprender o uso de JavaScript. O JavaScript é uma linguagem criada pela Netscape para introduzir capacidade de processamento dentro da linguagem HTML. Por ser baseado em Java é, em muitos aspectos, uma boa linguagem para o aprendizado inicial de Java. 2.1 Pré-requisitos Nenhum pré-requisito é necessário para acompanhar este texto. É recomendável que o leitor tenha algum conhecimento de HTML. Noções básicas de CGI, particularmente sobre a construção de formulários, e conhecimentos de Programação Orientada a Objetos podem ser habilidades adicionais desejáveis para o melhor proveito deste material. 2.2 Como funciona um script em JavaScript Um script em JavaScript é um programa que pode ser introduzido em uma página HTML, o que permite que seja executado através da Internet. Um script pode ser configurado para ser executado do lado do servidor (no provedor onde a página está neste caso, é dito server-side script ) ou do lado do cliente (no programa navegador browser de quem está acessando a página que contém o script neste caso, é dito client-side script ). Neste texto, serão abordados, apenas, os conceitos ligados a scripts do lado do cliente. Nestes scripts, o programa é transmitido através da Internet, do provedor onde está armazenado para o programa de navegação (por exemplo, o Netscape Communicator ou Microsoft Internet Explorer) do usuário e executado por este programa. Scripts são interpretados, ou seja, são executados diretamente na linguagem em que são escritos (diferente do que ocorre com as linguagens compiladas, em que o programa é traduzido para a linguagem nativa do processador onde será executado linguagem de máquina). Por esta razão, necessita-se apenas de um editor de texto e de um programa de navegação para se aprender e desenvolver programas escritos em JavaScript (como o Notepad e o Internet Explorer existentes em qualquer computador com o Microsoft Windows instalado). Programas são produzidos pela criação de variáveis (definição dos dados) e pela aplicação de comandos sobre elas (produção do algoritmo). Comandos podem ser agrupados estruturados para formar blocos de comandos denominados de funções. A linguagem oferece um conjunto de funções já elaboradas (biblioteca) que simplifica a tarefa de quem está escrevendo programas. 4 de 61

5 2.3 Um script simples em JavaScript Abaixo, é exibido um script em JavaScript bastante simples: <HTML> <BODY> <SCRIPT LANGUAGE=JAVASCRIPT> /* Primeiro programa em JavaScript. Autor: Rodolfo Goya */ document.write( "Alo Mundo" ); // Escreve alo mundo. </SCRIPT> </BODY> </HTML> Para poder-se descrever o que cada comando faz, vamos numerar as linhas (em um script em JavaScript não se deve numerar as linhas). 1 <HTML> 2 <BODY> 3 <SCRIPT LANGUAGE=JAVASCRIPT> 4 5 /* Primeiro programa em JavaScript. 6 Autor: Rodolfo Goya */ 7 8 document.write( "Alo Mundo" ); // Escreve alo mundo </SCRIPT> 11 </BODY> 12 </HTML> Todo script em JavaScript é um programa inserido em uma página HTML. Por isso, existem os comandos das linhas 1, 2, 11 e 12. O comando <HTML> (linha 1) diz que o arquivo tem conteúdo em HTML e marca o início dos comandos. O comando </HTML> (linha 12) delimita o final dos comandos HTML. Um arquivo HTML tem duas seções, uma denominada HEAD, delimitada entre os comandos <HEAD> e </HEAD> (inexistentes neste exemplo), e uma denominada BODY, delimitada entre os comandos <BODY> (linha 2) e </BODY> (linha 11). O Script deste exemplo está todo na seção BODY. 5 de 61

6 Um script em JavaScript fica delimitado entre os comandos <SCRIPT> (linha 3) e </SCRIPT> (linha 10). A especificação LANGUAGE=JAVASCRIPT (linha 10) diz qual a linguagem usada no script. Este programa só tem um comando que faz algo, no caso o comando document.write( "Alo Mundo" ); (linha 8) que imprime a mensagem: Alo Mundo Na tela do programa navegador (note-se não foram impressas as aspas). O comando usa a função write do objeto document. A função recebe parâmetros especificados entre parênteses no caso uma cadeia de caracteres entre aspas. Estes conceitos serão abordados detalhadamente mais adiante. O comando é delimitado com um ponto e vírgula no final (;). Este delimitador é opcional em JavaScript, porém é recomendável o seu uso para melhorar a clareza do programa. O programa também contém alguns comentários, ou seja, textos que são ignorados pelo computador inseridos para tornar mais claro para o programador o significado dos comandos usados no programa. Pode-se inserir um comentário de duas maneiras: a) // Linha de comentário até o final da linha. ou b) /* Delimitadores para início de comentário. */ Delimitadores para final de comentário. Pelo primeiro modo, tudo entre o // e o final da linha é ignorado pelo computador. Um exemplo deste tipo de comentário está na linha 8 do programa. No segundo modo, tudo entre o /* e o */ é ignorado pelo computador. Um exemplo deste tipo de comentário está nas linhas 5 e 6 do programa. Arquivos em HTML e JavaScript normalmente não exigem que se coloque um comando em cada linha. Contudo, colocar um comando por linha e incluir linhas em branco separando áreas do programa aumentam bastante a clareza do programa. O programa abaixo faz a mesma coisa que o primeiro exemplo: <HTML><BODY><SCRIPT LANGUAGE=JAVASCRIPT> document.write( "Alo Mundo" ); </SCRIPT></BODY> </HTML> 6 de 61

7 3 Tipos de Dados Básicos 3.1 Números (Number) Dados de tipo Number se destinam a armazenar valores numéricos. 3.2 String Dados de tipo String se destinam a armazenar cadeias de caracteres (letras maiúsculas e minúsculas, dígitos numéricos, símbolos, sinais de pontuação ou mesmo espaços em branco). Nome Universidade de São Paulo Símbolos e dígitos como: podem estar em strings Os delimitadores naturais para strings são " ou '. Caso seja necessária a utilização destes caracteres como parte do string, deve-se utilizar o caracter \ precedendo " ou ', ou seja \ codifica e \ codifica (também deve-se usar \\ para o próprio caracter \). Para colocar \ em um texto deve-se usar o caracter \\ seguido de \. Coloque o arquivo no diretório C:\\tmp 3.3 Caracteres de Controle Especiais \b backspace \n próxima linha (new line) \r retorno de carro (carriage return) \t character de tabulação (tab) \ caracter \ caracter \\ caracter \ 3.4 Boolean Dados de tipo boolean se destinam a armazenar valores que são verdadeiro (true) ou falso (false). 7 de 61

8 3.5 Criando Variáveis Uma variável pode ser definida com o uso do comando var. var minhavariavel; Cria uma variável de nome minhavariavel. Pode-se inicializar o valor de uma variável no momento de sua criação. Para isso, basta acrescentar o comando = seguido do valor desejado para a variável. Por exemplo: var minhavariavel = "Teste"; Cria uma variável de nome minhavariavel contendo o string Teste. Variáveis podem ser criadas automaticamente, pela simples associação de valores a mesma. Por exemplo, o comando: novavariavel = "Jose"; Cria uma variável de nome novavariavel contendo o string Jose. O tipo de dado armazenado em variáveis pode ser alterado dinamicamente. Por exemplo, os comandos: var novavariavel = "Jose"; novavariavel = 1; Criam uma variável de nome novavariavel contendo o string Jose que depois passa a conter o número 1 (ou seja muda de tipo String para tipo Number). 8 de 61

9 4 Comandos 4.1 Operadores Aritméticos São operadores a serem utilizados em cálculos aritméticos. Os operadores estão relacionados abaixo: + adição de valores. - subtração de valores. * multiplicação de valores. / divisão de valores. % resto de divisão resultará em resultará em * 10 resultará em / 10 resultará em % 10 resultará em Atribuição O operador = pode ser utilizado para designar valores para variáveis. a = 29; // colocará 29 na variável a. x = a 10; // colocará 19 na variável x. 4.3 Atribuição Aritmética O operador = pode combinado com os operadores aritméticos pra produzir os operadores relacionados abaixo: x += y é o mesmo que x = x + y x -= y é o mesmo que x = x - y x *= y é o mesmo que x = x * y x /= y é o mesmo que x = x / y x %= y é o mesmo que x = x % y a = 29; // colocará 29 na variável a. a += 20; // colocará 49 na variável a. a -= 10; // colocará 39 na variável a. a *= 2; // colocará 78 na variável a. a /= 3; // colocará 26 na variável a. a %= 7; // colocará 5 na variável a. 9 de 61

10 4.4 Incremento e decremento Pode-se somar um (incrementar) ou subtrair um (decrementar) de uma variável através dos operadores ++ e --.Quando o operador é colocado à esquerda da variável (pré) a operação de incremento/decremento é feita antes de todas as demais na expressão. Quando o operador é colocado à direita da variável (pós) a operação de incremento/decremento é feita depois de todas as demais na expressão. x++ é o mesmo que x = x + 1 (pós-incremento). ++x é o mesmo que x = x + 1 (pré-incremento). x-- é o mesmo que x = x - 1 (pós-decremento). --x é o mesmo que x = x - 1 (pré-decremento). a = 29; // colocará 29 na variável a. a++; // colocará 30 na variável a. a--; // colocará 29 na variável a. b = ++a; // colocará 31 na variável a e 31 na variável b. b = a--; // colocará 30 na variável a e 31 na variável b. b = --a; // colocará 29 na variável a e 29 na variável b. As operações de incremento ou decremento só se aplicam a variáveis. Não faz sentido aplicarem-se a valores ou expressões: 29++; // Não faz sentido! ( a + b )++;// Não faz sentido! 4.5 Operador para troca de sinal Para inverter sinal de um valor numérico, usa-se o operador. a = 29; // colocará 29 na variável a. a = -a; // colocará -29 na variável a. 10 de 61

11 4.6 Operadores + e += aplicados a String O operador + pode também ser usado para concatenação de string. a = "Bom "; // colocará "Bom " na variável a. b = "Dia"; // colocará "Dia" na variável b. c = a + b; // colocará "Bom Dia" na variável c. Quando se usa o operador + com variáveis de tipos diferentes que incluem strings, tais variáveis são convertidas para strings e concatenadas. a = "abc "; // colocará "abc " na variável a. b = 4; // colocará o valor 4 na variável b. c = a + b; // colocará "abc 4" na variável c. O operador += concatena um string a outro string já existente em uma variável. Ou seja, x += y é o mesmo que x = x + y. a = "Bom "; // colocará "Bom " na variável a. a += "Dia"; // colocará "Bom Dia" na variável a. 11 de 61

12 4.7 Operadores Relacionais São operadores que expressam relação de ordem entre valores numéricos, resultando em valores verdadeiro ou falso. Os operadores estão relacionados abaixo: == Igual === Igualdade de valor e de tipo!= Diferente > Maior >= Maior ou Igual < Menor <= Menor ou Igual a = 5 > 3; // colocará true na variável a. a = 5 < 3; // colocará false na variável a. a = 5 >= 3; // colocará true na variável a. a = 5 <= 3; // colocará false na variável a. a = 5 == 3; // colocará false na variável a. a = 5!= 3; // colocará true na variável a. a = 5 >= 5; // colocará true na variável a. a = 5 <= 5; // colocará true na variável a. a = 5 == 5; // colocará true na variável a. a = 5!= 5; // colocará false na variável a. No caso do operador ===, uma comparação só resulta em valores verdadeiro se as variáveis comparadas tem o mesmo valor e são do mesmo tipo. a = ( 1 == "1" ); // colocará true na variável a. a = ( 1 === "1" ); // colocará false na variável a. Esta diferença ocorre porque pode haver conversão de tipos no momento de se comparar dados de tipos diferentes. 12 de 61

13 4.8 Operadores Lógicos São operadores que lidam com valores de tipo boolean (verdadeiro ou falso) e que resultam em valores boolean (verdadeiro ou falso). Os operadores estão relacionados abaixo: && Operação Lógica E Operação Lógica Ou A operação lógica E entre dois valores só resulta verdadeira se os dois valores forem verdadeiros. Caso contrário, o resultado é falso. A operação lógica Ou entre dois valores resulta verdadeira se pelo menos um dos dois valores forem verdadeiros. Caso contrário, o resultado é falso. a = true && true; // colocará true na variável a. b = true && false; // colocará false na variável b. c = false && true; // colocará false na variável c. d = false && false; // colocará false na variável d. a = true true; // colocará true na variável a. b = true false; // colocará true na variável b. c = false true; // colocará true na variável c. d = false false; // colocará false na variável d. 13 de 61

14 4.9 Precedência de operadores A precedência de operadores é a regra que define qual a ordem com que as operações são realizadas em uma expressão que reuna diversos operadores. Por exemplo, a expressão abaixo: x = 3 + y * 4; Possui dois operadores: + e *. A precedência permite que se resolva qual será avaliado primeiro: se primeiro fazemos a soma e em seguida multiplicamos o resultado por 4 ou se fazemos primeiro o produto e depois somamos 3 ao resultado. Na expressão em questão, a multiplicação será feita primeiro e depois a soma. Caso se quisesse fazer primeiro a soma deve-se usados os parênteses: x = ( 3 + y ) * 4; Deste modo, a ordem de precedência dos operadores na linguagem JavaScript está tabelada abaixo: Operador Associatividade () Esquerda para direita (pré) Esquerda para direita. - (unário) Esquerda para direita. * / % Esquerda para direita. + - (binário) Esquerda para direita. > >= < <= Direita para esquerda. ==!= === Direita para esquerda. && Direita para esquerda. Direita para esquerda. += -= *= /= %= Direita para esquerda. = Direita para esquerda (pós) Esquerda para direita. 14 de 61

15 5 Entrada/Saída em JavaScript 5.1 Função write A linguagem JavaScript permite que o programador escreva dentro de uma página (documento), através da função write. As linhas escritas desta forma, podem conter textos, expressões JavaScript e comandos HTML. As linhas escritas através desta função aparecerão no ponto da tela onde o comando for inserido. <script> valor = 30; document.write( "Minha primeira linha." ); document.write( "Nesta linha aparecerá o resultado de: " + ( 10 * 10 + valor) ); </script> A execução deste script resultará na saída: Minha primeira linha.nesta linha aparecerá o resultado de: 150 Pode-se notar que, apesar se usar dois comandos para a escrita, a saída foi feita em apenas uma linha. Isto ocorre porque a função write não insere mudança de linha. Contudo, comandos HTML podem ser inseridos na função write. Por exemplo, (usando os comandos HTML <p>e </p>): <script> valor = 30; document.write( "<p>minha primeira linha</p>" ); document.write( "<p>nesta linha aparecerá o resultado de: " + (10 * 10 + valor) + "</p>" ); </script> Cuja execução resultará na saída: Minha primeira linha. Nesta linha aparecerá o resultado de: 150 Ou, por exemplo, (usando o comando HTML <br>): <script> valor = 30; document.write( "<br>minha primeira linha" ); document.write( "<br>nesta linha aparecerá o resultado de : " + (10 * 10 + valor) ); </script> Cuja execução resultará na saída: Minha primeira linha. Nesta linha aparecerá o resultado de: de 61

16 5.2 Mensagens Existem três formas de comunicação com o usuário através de mensagens Alert O comando alert() coloca uma janela com uma mensagem na tela e aguarda que o usuário pressione o botão para prosseguir. Formato do comando: alert( mensagem ) Onde: mensagem: String contendo a mensagem a ser exibida. Mensagens de várias linhas podem ser obtidas com o uso de \n no String. alert( "Certifique-se de que as informações estão corretas" ); Figura 1 Mensagem produzida pelo comando alert(). 16 de 61

17 5.2.2 Confirm O comando confirm() coloca uma janela com uma mensagem na tela e aguarda que o usuário pressione um botão de confirmação para prosseguir. A confirmação pode ser OK ou Cancelar. Formato do comando: confirm( mensagem ) Onde: mensagem: String contendo a mensagem a ser exibida. Mensagens de várias linhas podem ser obtidas com o uso de \n no String. teste = confirm( "Algo está errado...devo continuar??" ); Figura 2 Mensagem produzida pelo comando confirm(). Neste caso, a variável teste, de tipo boolean, receberá o valor true, se o usuário teclar o botão OK e false se teclar o botão Cancelar. 17 de 61

18 5.2.3 Prompt O comando prompt() coloca uma janela com uma mensagem na tela e aguarda que o usuário pressione um botão para prosseguir. A confirmação pode ser OK ou Cancelar. Formato do comando: receptor = prompt ( mensagem, texto ) Onde: receptor: é uma variável de tipo String que vai receber a informação digitada. mensagem: é a mensagem que vai aparecer na janela. texto: é um texto que aparecerá na linha de digitação do usuário. entrada = prompt( "Qual seu time favorito?", "São Paulo" ); Figura 3 Mensagem produzida pelo comando prompt(). Neste caso, a variável entrada, de tipo String, receberá o valor São Paulo (ou outro String que o usuário digite), se o usuário teclar o botão OK e null se teclar o botão Cancelar. 18 de 61

19 6 Comandos de Controle São comandos usados para controlar a execução dos comandos do programa, seja condicionando sua execução ao atendimento de uma determinada condição, seja permitindo a formação de estruturas para repetição de comandos. Os comandos de controle são: if if-else switch-case atribuição condicional for while do-while 19 de 61

20 6.1 Comando if O comando if executa um comando se uma condição dada for verdadeira (true). A. sintaxe do comando if é a seguinte: if( condição ) comando; O comando é executado se a condição for verdadeira. Note que não se usa ; entre o if e o comando (o ; delimita o final do comando. Se houvesse um ; seria interpretado como um comando vazio que não faz nada condicionado ao if). if( idade < 18 ) categoria = "Menor"; Caso se queira condicionar a execução de mais de um comando à condição, deve-se agrupar os comandos com o uso de chaves: if( condição ) { comando1; comando2; comando3; } Os comandos comando1, comando2 e comando3 são executados se a condição for verdadeira. Se não for, nenhum dos comandos é executado. 20 de 61

21 6.2 Comando if-else O comando if-else executa um comando se uma condição dada for verdadeira (true). Caso a condição seja false um outro comando é executado A. sintaxe do comando if é a seguinte: if( condição ) comando1; else comando2; O comando1 é executado se a condição for verdadeira. O comando2 é executado se a condição for falsa (Note que não se usa ; entre o else e o comando2). if( idade < 18 ) categoria = "Menor"; else categoria = "Maior"; Caso se queira condicionar a execução de mais de um comando à condição, deve-se agrupar os comandos com o uso de chaves: if( condição ) { comando1; comando2; comando3; } else { comando4; comando5; comando6; } Os comandos comando1, comando2 e comando3 são executados se a condição for verdadeira. Se não for, os comandos comando4, comando5 e comando6 são executados. Também são possíveis as construções abaixo: if( condição ) e if( condição ) { comando1; comando1; else comando2; { comando3; comando2; } comando3; else comando4; comando4; } 21 de 61

22 6.3 Comando switch-case Nos comandos de controle if e if-else a decisão tomada permitia a escolha dentre duas possíveis alternativas. Com o comando de controle switch pode-se escolher um comando a ser executado dentre diversos possíveis valores de uma expressão. A estrutura de um comando de controle switch é descrita abaixo: switch( variável ) { case x1: comando_x1; break; case x2: comando_x2; break; case x3: comando_x3; break; case x4: comando_x4; break; default: comando_x5; } O comando switch mostrado é equivalente ao comando abaixo: if( variável == x1 ) comando_x1; else if( variável == x2 ) comando_x2; else if( variável == x3 ) comando_x3; else if( variável == x4 ) comando_x4; else comando_x5; Se a variável for igual a x1, então comando_x1 é executado. Se a variável for igual a x2, então comando_x2 é executado. Se a variável for igual a x3, então comando_x3 é executado. Se a variável for igual a x4, então comando_x4 é executado. Se a variável for diferente de todos eles, então comando_x5 é executado. Não há limites para o número de cases que podem ser usados em um comando switch. Os valores x1, x2, x3 e x4 usados no comando são constantes, normalmente números inteiros ou Strings. Caso haja valores iguais em dois ou mais diferentes cases será executado o comando ligado ao primeiro case. 22 de 61

23 Um case em particular recebe o nome de default e é colocado no final do comando switch. O comando associado ao default é executado sempre que nenhum case corresponda ao valor associado à expressão do switch. Um comando adicional associado ao comando de switch é o comando break que determina o término da seqüência de comandos associados ao case. Assim, na ausência de um break, a execução de um case pode prosseguir no case seguinte. switch( letra ) { case 'a': case 'e': case 'i': case 'o': case 'u': document.write( " A letra é uma vogal.<br>" ); break; default: document.write( "A letra é uma consoante. <BR>" ); } 23 de 61

24 6.4 Atribuição Condicional O operador de atribuição condicional é um modo abreviado para um comando if-else com uso para comando de atribuição. A estrutura para o operador condicional é descrita abaixo: variavel = ( exp1 )? exp2 : exp3; Se a expressão exp1 for verdadeira, a variável recebe o valor da expressão exp2. Se for falso da expressão exp3. A expressão acima é equivalente ao comando abaixo: if( exp1 ) variavel = exp2; else variavel = exp3; Por exemplo, o comando abaixo atribui à variável x o valor absoluto da variável y: x = ( y > 0 )? y : -y; 24 de 61

25 6.5 Comando for Um loop do tipo for apresenta a estrutura abaixo: for( exp1; exp2; exp3 ) comando; A expressão exp1 é uma inicialização. É executada apenas uma vez, exatamente no momento em que se vai iniciar o processamento do loop. A segunda expressão (exp2) é uma condição de teste. É avaliada antes de cada possível passagem do loop. Quando esta expressão resultar em valor falso o loop é terminado. A terceira expressão é avaliada ao final de cada loop. A cada passagem do loop o comando é executado uma vez. O loop for é próprio para quando se deseja executar o loop um número determinado de vezes. <script> var n; for( n = 0; n < 10; n++ ) document.write( " Impressão número " + n + "<BR>" ); </script> Cuja execução resultará na saída: Impressão número 0 Impressão número 1 Impressão número 2 Impressão número 3 Impressão número 4 Impressão número 5 Impressão número 6 Impressão número 7 Impressão número 8 Impressão número 9 25 de 61

26 Caso seja executado mais de um comando dentro do loop, estes ficam delimitados por chaves {}: <script> var i, ano; var atual, taxa; document.write( "Estima a populacao nos proximos anos..<br>" ); atual = ; // 170 milhões. taxa = 1.02; // 2% ao ano. ano = 2000; for( i = 1; i <= 10; i++ ) // repete 10 vezes. { ano++; atual *= taxa; document.write( "ano " + ano + " populacao= " + atual + "<BR>" ); } </script> Cuja execução resultará na saída: Estima a populacao nos proximos anos.. ano 2001 populacao= ano 2002 populacao= ano 2003 populacao= ano 2004 populacao= ano 2005 populacao= ano 2006 populacao= ano 2007 populacao= ano 2008 populacao= ano 2009 populacao= ano 2010 populacao= Os loops for podem ser aninhados: <script> var i, j; document.write("tabuada do 1 ao 10:<BR>"); for( i = 1; i <= 10; i++ ) { for( j = 1; j <= 10; j++ ) document.write(" " + i * j ); document.write("<br>"); } </script> 26 de 61

27 Cuja execução resultará na saída: Tabuada do 1 ao 10: O loop for é muito flexível. Pode-se decrementar a contagem ao invés de incrementar: <script> var n; document.write( "Contagem regressiva...<br>" ); for( n = 10; n > 0; n-- ) document.write( n + " segundos<br>" ); </script> Cuja execução resultará na saída: Contagem regressiva segundos 9 segundos 8 segundos 7 segundos 6 segundos 5 segundos 4 segundos 3 segundos 2 segundos 1 segundos 27 de 61

28 Pode-se ter a contagem em qualquer passo: <script> var n; for( n = 10; n < 230; n = n + 15 ) document.write( n + "<BR>" ); </script> Cuja execução resultará na saída: de 61

29 6.6 Comando while Os loops do tipo while apresentam a forma abaixo: while( expresão ) comando; No comando while a expressão é avaliada ao início do loop. Se esta resultar verdadeira, então o comando é efetuado e, então, a expressão é reavaliada reiterando o processo que só terminará quando a expressão for avaliada e se tornar falsa. O loop while é próprio para quando se deseja executar o loop um número indeterminado à priori de vezes. <script> var entrada; var n; n = 1; while( ( entrada = prompt( "Tecle uma frase.", "" ) )!= null ) { document.write("frase " + n + ": " + entrada ); document.write(" (" + entrada.length + " Caracteres. )<br>" ); n++; } </script> 29 de 61

30 6.7 Comando do-while Os loops do tipo do-while apresentam a forma abaixo: do comando; while (expresão); A principal diferença entre um loop while e um do-while é que, no segundo caso, o comando é sempre executado pelo menos uma vez independentemente da possibilidade da expressão ser avaliada como falsa já ao início do loop. O loop do tipo do-while é próprio para quando se deseja executar o loop um número indeterminado de vezes porém pelo menos uma vez. <script> var entrada; var n; n = 1; do { entrada = prompt( "Tecle uma frase.", "" ); document.write("frase " + n + ": " + entrada ); document.write(" (" + entrada.length + " Caracteres. )<br>" ); n++; } while( entrada!= null ); </script> 30 de 61

31 6.8 Comandos break e continue Nos comandos for, while e do-while a diretiva break pode ser utilizada para interromper a condição principal e sair do loop. Da mesma forma, a diretiva continue interrompe uma ação (se determinada condição ocorrer) mas volta para o início do loop. 31 de 61

32 7 Funções Uma função é um conjunto de comandos, que podem ser executadas quando a função for chamada. Sua sintaxe é a seguinte: function nomedafunção( Parâmetros ) { Comandos } function imprimebarra( n ) // Imprime n caracteres =. { var i; } for( i = 0; i < n; i++ ) document.write( = ); Para chamar esta função (supondo o script abaixo na mesma página que a da função), devemos usar o nome da função para que a função seja acionada. var pontos = 10; document.write( "<BR>Alice\t" ); imprimebarra( pontos ); document.write( "<BR>Beatriz\t" ); imprimebarra( pontos + 5 ); document.write( "<BR>Carol\t" ); imprimebarra( 12 ); Resultam na saída descrita abaixo: Alice ========== Beatriz =============== Carol ============ É importante notar que não existe relação entre o nome da variável passada como parâmetro e a variável de recepção na função. Apenas o valor conteúdo é passado para a função. 7.1 Variáveis em funções Variáveis podem ser de dois tipos: locais ou globais.variáveis criadas dentro de uma função são locais e referenciáveis apenas dentro da função. Variáveis criadas fora das funções são globais e podem ser referenciadas em qualquer parte do documento (desta forma, variáveis a serem referenciadas por diferentes funções, devem ser definidas como globais). Em uma função, pode-se definir variáveis locais com o mesmo nome de variáveis globais (a variável local é criada, dentro da função, com o comando var). var x = 0; // Variável global. 32 de 61

33 function funcaoqualquer() { var x; // Variável local. } x = 1; // A variável afetada é a local (a criada dentro da função). 7.2 Funções sem parâmetros Uma função não precisa, necessariamente, receber parâmetros. A função abaixo não tem: function imprimeseparacao() { var i; for( i = 0; i < 80; i++ ) document.write( '-' ); } document.write( "<br>" ); Contudo, sua chamada exige o uso dos parênteses: imprimeseparacao(); 33 de 61

34 7.3 Funções que retornam valores Uma função pode retornar um valor (que pode ser de qualquer tipo que possa ser armazenado em uma variável). O valor retornado pela função deve ser enviado através do comando return. A função abaixo exemplifica a idéia: function levogal() { var c; var msg; msg = "Tecle uma vogal"; do { c = prompt( msg, "" ); if( c!= 'a' && c!= 'e' && c!= 'i' && c!= 'o' && c!= 'u' ) msg = "Você não teclou uma vogal.\ntecle uma vogal"; } while( c!= 'a' && c!= 'e' && c!= 'i' && c!= 'o' && c!= 'u' ); } return c; // Comando que faz com que a função retorne valor. Na chamada, é necessário que se coloque o dado retornado em uma variável: var x; x = levogal(); document.write("vogal teclada: " + x + "<br>" ); 34 de 61

35 7.4 Funções Intrínsecas São funções embutidas na própria linguagem. Sua sintaxe é a seguinte: variavel = função( Parâmetros ) Abaixo, são apresentadas algumas das funções intrínsecas disponíveis. Função eval() parseint() parsefloat() Descrição Calcula o conteúdo da string. Transforma string em inteiro. Transforma string em número com ponto flutuante. Result = eval( "( 10 * 20 ) + 2-8" ); Result = parseint( "1234" ); No primeiro exemplo, Result recebe o valor 194. No segundo, de 61

36 7.5 Funções Matemáticas Função Retorna Math.abs( número ) Valor absoluto do número (ponto flutuante). Math.abs( número ) Valor absoluto do número. Math.acos( número ) Arco cosseno de um número (em radianos). Math.asin( número ) Arco seno de um número (em radianos). Math.atan( número ) Arco tangente de um número (em radianos). Math.ceil( número ) Próximo valor inteiro maior que o número. Math.cos( número ) Cosseno de um número (ângulo em radianos). Math.exp( número ) Cálculo do exponencial do número. Math.floor( número ) Próximo valor inteiro menor que o número. Math.log( número ) Logarítmo de um número. Math.max( número1, número2 ) Maior número dos dois fornecidos. Math.min( número1, número2 ) Menor número dos dois fornecidos. Math.pow( base, expoente ) Cálculo do exponencial. Math.random() Número aleatório entre 0 e 1. Math.round( número ) Valor inteiro, arredondado, do número. Math.sin( número ) Seno de um número (ângulo em radianos) Math.sqrt( número ) Raiz quadrada do número. Math.tan( número ) Tangente de um número (ângulo em radianos). Math.SQRT2 Raiz quadrada de 2 (2 1/2 : aprox. 1, ). Math.SQRT_2 Raiz quadrada de ½ (2-1/2 : aprox. 0, ). Math.E Base dos logarítmos naturais (e: aprox. 2, ). Math.PI Valor de PI (π: aprox. 3, ). Math.LN2 Logarítmo neperiano de 2 ( ln(2): aprox. 0, ). Math.LOG2E Logarítmo de e na base 2 (log 2 e: aprox. 1, ). Math.LN10 Logarítmo neperiano de 10 (ln(10): aprox. 2, ). Math.LOG10E Logarítmo de e na base 10 (log 10 (e): aprox. 0, ). 36 de 61

37 7.6 Funções de manipulação de Strings A linguagem JavaScript é bastante poderosa no manuseio de Strings, fornecendo ao programador uma grande flexibilidade para manuseio. Abaixo, são apresentadas as funções disponíveis para manuseio de strings. Função Descrição String.length Tamanho da string (quantidade de bytes). String.charAt( posição ) Caracter na posição especificada (inicia em 0). String.indexOf( String ) Número da posição onde começa a primeira string. String.lastindexOf( String ) Número da posição onde começa a última string. String.substring( index1, index2 ) Conteúdo da string que corresponde ao intervalo especificado. Começando no caracter posicionado em index1 e terminando no caracter imediatamente anterior ao valor especificado em index2. String.toUpperCase() Transforma o conteúdo da string para maiúsculo. String.toLowerCase() Transforma o conteúdo da string para minúsculo. Escape( String ) Valor ASCII da string (vem precedido de %). Unscape( String ) Caracter a partir de um valor ASCII (precedido de %). todo = "JavaScript"; parte = todo.substring( 0, 4 ); A variável Parte receberá a string Java. 37 de 61

38 8 Classes, Objetos e Arrays em Javascript Pode-se criar classes em JavaScript com a mesma sintaxe para criar funções. Por exemplo, pode-se criar uma classe para pessoas como no exemplo abaixo: function Pessoa( nome, idade, sexo ) { this.nome = nome; this.idade = idade; this.sexo = sexo; } Neste caso, a classe criada tem, como atributos, nome, idade e sexo. Os atributos são definidos em JavaScript pelo uso da palavra reservada this. 8.1 Criando Objetos Através do operador new pode-se criar novas instâncias de objetos de classes já existentes, mudando o seu conteúdo, porém, mantendo suas propriedades. A sintaxe geral é a seguinte: NovoObjeto = new ObjetoExistente( parâmetros ) professor = new Pessoa( "Goya", 38, M ); presidente = new Pessoa( "Cardoso", 68, M ); De modo que professor é um objeto da classe Pessoa, com os atributos nome, idade e sexo correspondentes a, respectivamente, Goya, 38, M e presidente também é um objeto da classe Pessoa, com os atributos nome, idade e sexo correspondentes a, respectivamente, Cardoso, 68, M. Os atributos de um objeto podem ser acessados e modificados usando-se o nome do objeto junto do atributo (separados por um. ), do seguinte modo: document.write( presidente.nome ); //. entre presidente e nome. professor.idade++; //. entre professor e idade. No primeiro caso, foi impresso na tela o String Cardoso. No segundo caso, o atributo idade foi alterado de 38 para de 61

39 8.2 Criando Funções para Classes Funções podem ser ligadas a classes. Para tanto, pode-se definir a função e associá-la a classe do mesmo modo que se faz com um atributo. O modo como isto pode ser feito é ilustrado abaixo: function exibedados() { return "Nome: " + nome + "Idade: " + idade + "Sexo: " + sexo; } function Pessoa( nome, idade, sexo ) { this.nome = nome; this.idade = idade; this.sexo = sexo; this.exibedados = exibedados(); // Inclui a função na classe. } Os parênteses são importantes para definir exibedados como uma função (e não um atributo) mesmo que a função a ser criada e chamada não tenha parâmetros.pode-se criar objetos de classe pessoa e usar a função associada a esta classe. Funções podem ser ligadas a classes. O modo como isto pode ser feito é ilustrado abaixo: var p; var s; p = new Pessoa( "Goya", 38, M ); s = p.exibedados(); 39 de 61

40 8.3 Criando Atributos Dinamicamente Novos atributos para um objeto podem ser criados na medida que o programa é executado. O modo como isto pode ser feito é ilustrado abaixo: function exibedados() { return "Nome: " + nome + "Idade: " + idade + "Sexo: " + sexo; } function Pessoa( nome, idade, sexo ) { this.nome = nome; this.idade = idade; this.sexo = sexo; this.exibedados = exibedados(); // Inclui a função na classe. } var p; p = new Pessoa( "Goya", 38, M ); p.altura = 1.76; Neste exemplo, o objeto p adquiriu o atributo adicional altura. Somente este objeto foi alterado. Todos os demais objetos da classe Pessoa permanecem inalterados. Pode-se incluir um novo atributo para todos os objetos da classe: Pessoa.altura = 1.7; Neste exemplo, todos os objetos da classe Pessoa passam a ter um novo atributo (altura) e todos eles recebem o mesmo valor (1.7). Por permitir definir o conjunto de atributos que a classe tem dinamicamente, pode-se tornar problemático resolver qual objeto tem quais atributos. A linguagem oferece uma construção que permite percorrer todos os atributos do objeto: for-in for( i in p ) document.write( "Atributo: " + i + valor: " + p.i ) + "<BR>" ); Neste exemplo, a variável i recebe todos os valores possíveis de atributos que o objeto p tenha. 40 de 61

41 8.4 Manipulando Arrays Arrays são conjuntos de variáveis do mesmo tipo e chamados coletivamente de um mesmo nome. A diferenciação entre os elementos de um array é feita através de um índice. Normalmente o primeiro elemento do array tem índice 0. Em JavaScript não há um tipo de dado ou objeto para manipular arrays. Por isso, para trabalhar com arrays, é necessário criar um objeto com a propriedade de criação de um array. No exemplo abaixo, é criado um objeto tipo array de tamanho definido por uma variável e limpando o conteúdo inicial das variáveis cada vez que uma nova instância seja criada a partir dele. function CriaArray( n ) { this.length = n; for( var i = 0 ; i < n; i++ ) this[i] = ""; } Agora, pode-se criar arrays pela criação de novas instâncias do objeto da classe CriaArray. nomedia = new CriaArray( 7 ); nomedia[0] = "Domingo"; nomedia[1] = "Segunda"; nomedia[2] = "Terça"; nomedia[3] = "Quarta"; nomedia[4] = "Quinta"; nomedia[5] = "Sexta"; nomedia[6] = "Sábado"; atividade = new CriaArray( 5 ); atividade[0] = "Analista"; atividade[1] = "Programador"; atividade[2] = "Operador"; atividade[3] = "Conferente"; atividade[4] = "Digitador"; Agora pode-se obter os dados diretamente dos arrays. diasemana = nomedia[4]; ocupacao = atividade[1]; Neste caso, a variável diasemana passaria a conter Quinta e ocupacao conteria Programador. 41 de 61

42 Pode-se criar arrays de objetos: function Pessoa( nome, idade, sexo ) { this.nome = nome; this.idade = idade; this.sexo = sexo; } turma =new Pessoa[]; turma[0] = new Pessoa( "Alice", 5, F ); turma[1] = new Pessoa( "Beatriz", 7, F ); turma[2] = new Pessoa( "Carol", 5, F ); Assim, pode-se obter o nome do elemento número 2 da turma, cuja resposta seria Carol, da seguinte forma: nome = turma[2].nome; 42 de 61

43 8.5 Objeto para Manipulação de Datas Existe uma função para que se possa obter a data e a hora. É a função Date(). Esta função devolve data e hora no formato: Dia da semana, Nome do mês, Dia do mês, Hora:Minuto:Segundo e Ano document.write( Date() ); Que resulta na saída (o resultado é sempre em inglês): Fri Sep 08 16:58: Para se obter os dados separadamente, existem as seguintes funções: Função Descrição getdate() Obtém o dia do mês (numérico de 1 a 31) getday() Obtém o dia da semana (de 0 a 6) getmonth() Obtém o mês (numérico de 0 a 11) getyear() Obtém o ano gethours() Obtém a hora (numérico de 0 a 23) getminutes() Obtém os minutos (numérico de 0 a 59) getseconds() Obtém os segundos (numérico de 0 a 59) No exemplo abaixo, obtém-se o dia da semana. Para tal, utiliza-se a variável dia para armazenar data/hora e a variável hoje para armazenar o número do dia da semana. dia = new Date(); hoje = DataToda.getDay(); Para se obter o dia da semana na forma de string, deve-se construir uma tabela com os dias da semana e utilizar a variável hoje como indexador. function CriaTab( n ) { this.length = n; for( var x = 1; x <= n; x++ ) this[x] = ""; } nomedia = new CriaTab( 7 ); nomedia[0] = "Domingo"; nomedia[1] = "Segunda"; nomedia[2] = "Terça"; nomedia[3] = "Quarta"; nomedia[4] = "Quinta"; nomedia[5] = "Sexta"; nomedia[6] = "Sábado"; diasemana = nomedia[ hoje ]; 43 de 61

44 Uma variável da classe Date pode ter seu conteúdo modificado. Para isso, existem as funções: setdate(), setday(), setmonth(), setyear(), sethours(), setminutes() e setseconds(). Por exemplo acima, pode-se mudar o mês do objeto dia para novembro, através do comando: dia.setmonth(10); 44 de 61

45 9 Interface com o Usuário Um script pode interagir com o usuário através de objetos para entrada de dados (textos), seleção de opções (radio, checkbox e combo), botões ou links. Estes objetos são os mesmos usados pela linguagem HTML para a construção de formulários e são inseridos no script do mesmo modo. Os objetos existentes para interação com o usuário são quatro: Input, Textarea, Select e Link. Os objetos Input são de oito tipos (podem ser identificados pela propriedade type): Text Password Hidden Checkbox Radio Button Reset Submit 9.1 Objeto Input: Text É o principal objeto para entrada de dados. Por este objeto, o usuário pode teclar um string de uma linha. Suas propriedades são: type, size, maxlength, name e value: type=text: Especifica um campo para entrada de dados normal. size: Especifica o tamanho do campo na tela. maxlength: Especifica a quantidade máxima de caracteres permitidos. name: Especifica o nome do objeto. value: Armazena o conteúdo do campo. <form method="post" name="testtext"> <p> Entrada de Texto <input type=text size=20 maxlength=30 name="cxtexto" value=""> </p> </form> O resultado do exemplo aparece na figura abaixo: Figura 4 Objeto Input:Text 45 de 61

46 9.2 Objeto Input Password É um objeto para entrada usado tipicamente para digitação de senhas (password). São semelhantes ao Text. A diferença é que os dados digitados são exibidos na tela como "*". Suas propriedades são: type, size, maxlength, name e value. type=password: Especifica um campo para entrada de senha. size: Especifica o tamanho do campo na tela. maxlength: Especifica a quantidade máxima de caracteres permitidos. name: Especifica o nome do objeto. value: Armazena o conteúdo digitado no campo. <form method="post" name="tpassword"> <p> Entrada de Senha <input type=password size=10 maxlength=10 name="senha" value=""> </p> </form> O resultado do exemplo aparece na figura abaixo: Figura 5 Objeto Input:Password 9.3 Objeto Input: Hidden É semelhante ao input text, porém, invisível para o usuário. Este objeto deve ser utilizado para passar informações ao "server" (quando o formulário for submetido) sem que o usuário tome conhecimento. Suas propriedades são: name e value.!"name : Especifica o nome do objeto.!"value : Armazena o conteúdo do objeto. <form method="post" name="thidden"> <input type=hidden size=20 maxlength=30 name="hdtexto" value=""> </form> </p> 46 de 61

47 9.4 Objeto Input: Checkbox São objetos que permitem ao usuário ligar ou desligar uma determinada opção. Suas principais propriedades são: name, value e checked.!"name: Especifica o nome do objeto.!"value: Especifica o valor a ser enviado ao server se o objeto estiver marcado (checked). Caso seja omitido, será enviado o valor default "on". Esta propriedade também serve para ativar comandos lógicos, testando-se a condição de "checked". checked : Especifica que o objeto inicialmente estará ligado No exemplo abaixo, são criados três objetos checkbox. <form method="post" name="tcheck"> Passatempos:<p> Leitura<input type=checkbox name="opt1" value="1" checked> Musica<input type=checkbox name="opt2" value="2"> Cinema<input type=checkbox name="opt3" value="3"> Esportes<input type=checkbox name="opt4" value="4"> </p> </form> O resultado do exemplo aparece na figura abaixo: Figura 6 Objeto Input:Checkbox 47 de 61

48 9.5 Objeto Input: Radio São objetos que permitem ao usuário a escolha de apenas uma alternativa, diante de uma série de opções. Suas principais propriedades são: name, value e checked.!"name : Especifica o nome do objeto. Para caracterizar o objeto como membro de um mesmo conjunto de opções, todos os objetos de um conjunto têm o mesmo "name".!"value : Especifica o valor que será enviado ao "server" se o objeto estiver ligado (checked). Caso seja omitido, será enviado o valor default "on". Esta propriedade também serve para ativar comandos lógicos, testando-se a condição de "checked".!"checked : Especifica que o objeto inicialmente estará ligado. Para utilização deste objeto é importante o conhecimento de outras propriedades associadas: Objeto.length: Retorna a quantidade de opções existentes na lista. Objeto.[index].value: Retorna o texto (value) associado a cada opção. Objeto.[index].checked: Retorna verdadeiro ou falso. <form method="post" name="testeradio> Time favorito:<br> <input type=radio name="rad" value="1"> Corinthians <input type=radio name="rad" value="2"> Palmeiras <input type=radio name="rad" value="3"> Portuguesa <input type=radio name="rad" value="4"> Santos <input type=radio checked name="rad" value="5"> Sao Paulo </form> O resultado do exemplo aparece na figura abaixo: Figura 7 Objeto Input:Radio 48 de 61

49 9.6 Objeto Input: Button Este objeto um botão na página que permite criar, quando o mesmo for ativado pelo mouse, programas associados a ele. Suas propriedades são: name e value.!"name: Especifica o nome do objeto.!"value: Especifica o nome que aparecerá sobre o botão. <form method="post" name="tstbutton"> Aperte o Botão <input type=button name="bteste" value="botão de teste"> </form> O resultado do exemplo aparece na figura abaixo: Figura 8 Objeto Input: Button 9.7 Objeto Input: Reset Este objeto é um botão que tem por única finalidade limpar os campos digitados pelo usuário, restaurando o conteúdo do formulário para os valores iniciais. Suas propriedades são: name e value.!"name: Especifica o nome do objeto.!"value: Especifica o nome que aparecerá sobre o botão <p> <form method="post" name="testeres"> Restaura defaults <input type=reset name="bres" value="reset"> </form> </p> O resultado do exemplo aparece na figura abaixo: Figura 9 Objeto Input: Reset 49 de 61

50 9.8 Objeto Input: Submit Este objeto é um botão que tem por finalidade submeter (enviar) o conteúdo dos objetos do formulário ao "server". O formulário será submetido à URL especificada na propriedade "action" do formulário. Todos os dados do formulário são enviados para que uma aplicação do lado do servidor possa processá-los (isto é feito através do protocolo CGI, que não é abordado neste texto). Suas propriedades são: name e value.!"name: Especifica o nome do objeto.!"value: Especifica o nome que aparecerá sobre o botão. <script> <form method="post" name="testesub"> Envia Formulário <input type=submit name="bsub" value="envia"> </form> O resultado do exemplo aparece na figura abaixo: Figura 10 Objeto Input: Submit 50 de 61

51 9.9 Objeto TextArea É um objeto para entrada de dados em um campo de múltiplas linhas. Suas principais propriedades são: name, rows e cols.!"name: Especifica o nome do objeto.!"rows: Número de linhas que aparecerão na tela.!"cols: Número de colunas que aparecerão em cada linha.!"value: Acessa o conteúdo do campo via programação. <form name="testetextarea"> <p> Area de Texto <textarea name="multtext" rows=4 cols=40> Primeira linha do texto inicial segunda linha do texto inicial </textarea> </p> O resultado do exemplo aparece na figura abaixo: Figura 11 Objeto TextArea 51 de 61

52 9.10 Objeto Select É um objeto para entrada de opções, onde o usuário, a partir de uma lista de alternativas, seleciona uma ou mais opções. Suas principais propriedades são: name, size, value e multiple. name: Especifica o nome do objeto. size: Número de opções que aparecerão na tela simultaneamente. value: Associa um valor ou string para cada opção (opcional). multiple: Especifica a condição de múltipla escolha. Para utilização deste objeto é importante o conhecimento de outras propriedades associadas:!"objeto.length : Retorna a quantidade de opções existentes na lista.!"objeto.selectedindex: Retorna o indice do objeto selecionado (primeiro = 0).!"Objeto.options[index].text: retorna o texto externo associado a cada opção.!"objeto.options[index].selected: retorna verdadeiro ou falso.!"objeto.options[index].value: retorna o texto interno (value) associado a cada opção. Exemplo a: Nesta lista: 1. Permite-se apenas uma seleção. 2. A quarta opção aparecerá inicialmente selecionada (propriedade "selected"). 3. Não é utilizada a propriedade "value". Assim, a propriedade "text" e a propriedade "value" passam a ter o mesmo valor, ou seja, o valor externo que aparece na tela. <form> Objeto Select <select name="combo1" size=1> <option>opcao 1 <option>opcao 2 <option>opcao 3 <option selected>opcao 4 (recomendada) <option>opcao 5 <option>opcao 6 </select> </form> Figura 12 Objeto Select 52 de 61

53 Exemplo b: Nesta lista: 1. Permitem-se múltiplas seleções. Para o usuário escolher mais de uma, deve usar as teclas Shift ou Ctrl ao dar o Click do mouse. 2. Utiliza-se a propriedade "value". Assim as propriedades "text" e "value" têm valores diferentes: text retornará Escolha 1 a Escolha 6 e value retornará List1 a List6. 3. A lista exibe 4 itens de uma lista de 6 seleções possíveis. <p> <form> <select name="combo2" size=4 multiple> <option value="list1">escolha 1</option> <option value="list2" selected >Escolha 2</option> <option value="list3">escolha 3</option> <option value="list4" selected >Escolha 4</option> <option value="list5">escolha 5</option> <option value="list6">escolha 6</option> </select> </form> </p> Figura 13 Objeto Select 53 de 61

1-03/11/03 INTRODUÇÃO

1-03/11/03 INTRODUÇÃO 1-03/11/03 INTRODUÇÃO JavaScript é uma linguagem que permite injetar lógica em páginas escritas em HTML (HiperText Mark-up Language). As páginas HTML podem ser escritas utilizando-se editores de texto,

Leia mais

JavaScript: Validação de Formulários. Prof. Ivanilton Polato ipolato@utfpr.edu.br ipolato@gmail.com

JavaScript: Validação de Formulários. Prof. Ivanilton Polato ipolato@utfpr.edu.br ipolato@gmail.com JavaScript: Validação de Formulários Prof. Ivanilton Polato ipolato@utfpr.edu.br ipolato@gmail.com Validação de Formulários Um dos usos mais frequentes do JS é a validação de formulários. Além de garantir

Leia mais

Programação para Internet I

Programação para Internet I Programação para Internet I Aulas 09 e 10 Fernando F. Costa nando@fimes.edu.br Formulários O formulário representa o modo mais importante de interatividade que a linguagem HTML oferece. Um formulário pode

Leia mais

Algoritmos em Javascript

Algoritmos em Javascript Algoritmos em Javascript Sumário Algoritmos 1 O que é um programa? 1 Entrada e Saída de Dados 3 Programando 4 O que é necessário para programar 4 em JavaScript? Variáveis 5 Tipos de Variáveis 6 Arrays

Leia mais

O código JavaScript deve ser colocado entre tags de comentário para ficar escondido no caso de navegadores antigos que não reconhecem a linguagem.

O código JavaScript deve ser colocado entre tags de comentário para ficar escondido no caso de navegadores antigos que não reconhecem a linguagem. 1 - O que é JAVASCRIPT? É uma linguagem de script orientada a objetos, usada para aumentar a interatividade de páginas Web. O JavaScript foi introduzido pela Netscape em seu navegador 2.0 e posteriormente

Leia mais

Os componentes de um formulário são: Form, Input, Select e AreaText

Os componentes de um formulário são: Form, Input, Select e AreaText HTML Formulário O elemento FORM, da HTML, é o responsável por prover documentos interativos no ambiente WWW de forma que uma pagina web exibida a um usuário possa submeter um conjunto de dados, informados

Leia mais

INTRODUÇÃO AO DESENVOLVIMENTO WEB

INTRODUÇÃO AO DESENVOLVIMENTO WEB INTRODUÇÃO AO DESENVOLVIMENTO WEB PROFª. M.Sc. JULIANA H Q BENACCHIO Formulários Os formulários em HTML são usados para selecionar diferentes tipos de entradas do usuário. Um formulário é uma área que

Leia mais

Introdução ao Javascript

Introdução ao Javascript Programação WEB I Introdução ao Javascript Apresentação da Disciplina,Introdução a linguagem Javascript Objetivos da Disciplina Apresentar os principais conceitos da linguagem Javascript referente à programação

Leia mais

O que é o Javascript?

O que é o Javascript? O que é o Javascript? JavaScript é uma linguagem para criação de Home-Pages. Funções escritas em JavaScript podem ser embutidas dentro de seu documento HTML. Com JavaScript você tem muitas possibilidades

Leia mais

Aula 05 HTML FORMULÁRIOS Prof. Daniela Pires Sumário

Aula 05 HTML FORMULÁRIOS Prof. Daniela Pires Sumário Sumário FORMULÁRIO EM HTML... 2 FORM... 2 ACTION... 2 METHOD... 2 INPUT... 2 INPUT TYPE TEXT... 2 INPUT TYPE PASSWORD... 2 CHECKBOX - Múltipla escolha... 4 RADIO - Escolha única... 4 Botões de ação...

Leia mais

COMO FUNCIONA UM FORMULÁRIO

COMO FUNCIONA UM FORMULÁRIO FORMULÁRIOS Constitui-se numa das formas de a máquina cliente enviar informações para que um programa no servidor receba estes dados, processe-os e devolva uma resposta ao usuário, por meio do navegador,

Leia mais

Criando um script simples

Criando um script simples Criando um script simples As ferramentas de script Diferente de muitas linguagens de programação, você não precisará de quaisquer softwares especiais para criar scripts de JavaScript. A primeira coisa

Leia mais

Para testar seu primeiro código utilizando PHP, abra um editor de texto (bloco de notas no Windows) e digite o código abaixo:

Para testar seu primeiro código utilizando PHP, abra um editor de texto (bloco de notas no Windows) e digite o código abaixo: Disciplina: Tópicos Especiais em TI PHP Este material foi produzido com base nos livros e documentos citados abaixo, que possuem direitos autorais sobre o conteúdo. Favor adquiri-los para dar continuidade

Leia mais

Lista de operadores de comparação - > Maior que - < Menor que - <= Menor ou igual a - >= Maior ou igual a - === Igual a -!

Lista de operadores de comparação - > Maior que - < Menor que - <= Menor ou igual a - >= Maior ou igual a - === Igual a -! Página1 Javascript JavaScript (JS) é uma linguagem de programação client side Funciona no navegador do usuário. É uma linguagem baseada em objetos. "Walmir".length; 6 Para que serve - fazer websites responder

Leia mais

Os objetivos indicados aplicam-se a duas linguagens de programação: C e PHP

Os objetivos indicados aplicam-se a duas linguagens de programação: C e PHP AGRUPAMENTO DE ESCOLAS DE SANTA COMBA DÃO CURSO PROFISSIONAL DE TÉCNICO DE GESTÃO E PROGRAMAÇÃO DE SISTEMAS INFORMÁTICOS 2012-2015 PROGRAMAÇÃO E SISTEMAS DE INFORMAÇÃO MÓDULO 2 Mecanismos de Controlo de

Leia mais

Programação Web Prof. Wladimir

Programação Web Prof. Wladimir Programação Web Prof. Wladimir HTML - Formulários @wre2008 1 Sumário Formulários HTML @wre2008 2 Formulários: Muitos elementos de um formulário html são definidos pela tag . Cada tipo de elemento

Leia mais

APOSTILA DE JAVA SCRIPT

APOSTILA DE JAVA SCRIPT APOSTILA DE JAVA Introdução Operadores lógicos Operadores matemáticos Controles especiais Controles condicionais Eventos Criando variáveis Escrevendo no documento Mensagens Criando funções Funções intrinsecas

Leia mais

JavaScript (Funções, Eventos e Manipulação de Formulários)

JavaScript (Funções, Eventos e Manipulação de Formulários) Linguagem de Programação para Web JavaScript (Funções, Eventos e Manipulação de Formulários) Prof. Mauro Lopes 1-31 23 Objetivos Iremos avançar um pouco mais em nosso estudo sobre o JavaScript. Iremos

Leia mais

APRENDENDO JAVASCRIPT, UMA LÓGICA PARA WEB. Por André Marinho C. O QUE É JAVASCRIPT?

APRENDENDO JAVASCRIPT, UMA LÓGICA PARA WEB. Por André Marinho C. O QUE É JAVASCRIPT? APRENDENDO JAVASCRIPT, UMA LÓGICA PARA WEB. Por André Marinho C. O QUE É JAVASCRIPT? JavaScript é uma linguagem que permite injetar lógica em páginas escritas em HTML (HiperText Mark-up Language). As páginas

Leia mais

O código acima descreve o formulário com uma caixa de texto e dois botões

O código acima descreve o formulário com uma caixa de texto e dois botões Formulários Formulários permitem que os usuários interajam com um servidor Web passando informações. Assim, através da Web, se pode ler e gravar informações em Banco de Dados, gerando enormes possibilidades

Leia mais

ftp://ftp.cr-df.rnp.br/pub/netinfo/training/rnp/kit-bsb/html/guia3.zip dezembro 1995 Tutorial - Autoria em World Wide Web

ftp://ftp.cr-df.rnp.br/pub/netinfo/training/rnp/kit-bsb/html/guia3.zip dezembro 1995 Tutorial - Autoria em World Wide Web RNP REDE NACIONAL DE PESQUISA Centro Regional de Brasília CR/DF ftp://ftp.cr-df.rnp.br/pub/netinfo/training/rnp/kit-bsb/html/guia3.zip dezembro 1995 Tutorial - Autoria em World Wide Web Parte III - Hypertext

Leia mais

2 echo "PHP e outros.";

2 echo PHP e outros.; PHP (Hypertext Preprocessor) Antes de qualquer coisa, precisamos entender o que é o PHP: O PHP(Hypertext Preprocessor) é uma linguagem interpretada gratuita, usada originalmente apenas para o desenvolvimento

Leia mais

Prof Evandro Manara Miletto. parte 2

Prof Evandro Manara Miletto. parte 2 Prof Evandro Manara Miletto parte 2 Sumário Estruturas de Controle Eventos Estruturas de controle características Estruturas de controle (ou condicionais) são executadas caso um teste seja atendido Permite

Leia mais

Formulário (Send & Recieve) Prof. Celso H. Masotti

Formulário (Send & Recieve) Prof. Celso H. Masotti Formulário (Send & Recieve) Prof. Celso H. Masotti O Send e o Recieve A partir desse momento os exercícios serão realizados com dois arquivos, um de envio de dados (send) e o que recebe esse dados (recieve)

Leia mais

Javascript 101. Parte 2

Javascript 101. Parte 2 Javascript 101 Parte 2 Recapitulando O Javascript é uma linguagem de programação funcional Os nossos scripts são executados linha a linha à medida que são carregados. O código que está dentro de uma função

Leia mais

Conteúdo Dinâmico. Introdução. Interação Browser x Servidor Web. Interação Browser x Servidor Web

Conteúdo Dinâmico. Introdução. Interação Browser x Servidor Web. Interação Browser x Servidor Web Introdução Formulários rios & Conteúdo Dinâmico Mário Antonio Meireles Teixeira Dept o. de Informática - UFMA A Web surgiu inicialmente como uma nova forma de comunicação de informações, fazendo uso de

Leia mais

Programação WEB I Estruturas de controle e repetição

Programação WEB I Estruturas de controle e repetição Programação WEB I Estruturas de controle e repetição Operadores de Incremento Operadores de incremento servem como expressões de atalho para realizar incrementos em variáveis Operadores de Incremento Vamos

Leia mais

ALGUMAS CONSIDERAÇÕES

ALGUMAS CONSIDERAÇÕES ALGUMAS CONSIDERAÇÕES JavaScript é uma linguagem que permite injetar lógica em páginas escritas em HTML (HiperText Mark-up Language). As páginas HTML podem ser escritas utilizando-se editores de texto,

Leia mais

Conteúdo. DHTML tópicos Hamilton Lima - 2002-2004

Conteúdo. DHTML tópicos Hamilton Lima - 2002-2004 DHTML tópicos Hamilton Lima - 2002-2004 Conteúdo 1. meu primeiro script... 2 2. DOM Document Object Model...2 3. tipo de execução de scripts...2 4. resposta a um evento... 3 5. tipos de dados, variaveis

Leia mais

indica o nome do campo pelo qual podemos acessar.

indica o nome do campo pelo qual podemos acessar. Formulários Em geral Com o Javascript, os formulários Html tomam outra dimensão. Não esqueça que em Javascript, podemos acessar cada elemento de um formulário para, por exemplo, ler ou escrever um valor,

Leia mais

PROGRAMAÇÃO WEB DO LADO DO CLIENTE

PROGRAMAÇÃO WEB DO LADO DO CLIENTE PROGRAMAÇÃO WEB DO LADO DO CLIENTE FORMULÁRIO Na linguagem HTML é permitido que o usuário interaja com o servidor através de formulários ligados a scripts desenvolvidos em linguagens como PHP, Servlets,

Leia mais

OPERADORES E ESTRUTURAS DE CONTROLE

OPERADORES E ESTRUTURAS DE CONTROLE OPERADORES E ESTRUTURAS DE CONTROLE 3.1 Operadores Os operadores indicam o tipo de operação matemática que será executada gerando novos valores a partir de um ou mais operadores. São muito utilizados em

Leia mais

(c) 1997 Luis Carlos de Andrade Rodrigues. dricci@uninet.com.br Todos direitos reservados.

(c) 1997 Luis Carlos de Andrade Rodrigues. dricci@uninet.com.br Todos direitos reservados. (c) 1997 Luis Carlos de Andrade Rodrigues. dricci@uninet.com.br Todos direitos reservados. Manual JavaScript Operadores Matemáticos São operadores a serem utilizados em cálculos, referências de indexadores

Leia mais

Apostila sobre Java Script

Apostila sobre Java Script Apostila sobre Java Script 1 Java Script Básico... 3 1. Introdução... 3 1.1 O que é Java Script?... 3 1.2 Qual é a diferença entre Java e JavaScript?... 3 1.3 Um pequeno exemplo do uso de scripts... 4

Leia mais

Informática I. Aula 6. http://www.ic.uff.br/~bianca/informatica1/ Aula 6-12/09/2007 1

Informática I. Aula 6. http://www.ic.uff.br/~bianca/informatica1/ Aula 6-12/09/2007 1 Informática I Aula 6 http://www.ic.uff.br/~bianca/informatica1/ Aula 6-12/09/2007 1 Ementa Noções Básicas de Computação (Hardware, Software e Internet) HTML e Páginas Web Internet e a Web Javascript e

Leia mais

Web Design Aula 09: Formulários

Web Design Aula 09: Formulários Web Design Aula 09: Formulários Professora: Priscilla Suene priscilla.silverio@ifrn.edu.br Motivação Roteiro Tag ... Tag Tag ... Rádio Checkbox Atributo name Form Um

Leia mais

Desenvolvimento de Aplicações para Internet

Desenvolvimento de Aplicações para Internet Desenvolvimento de Aplicações para Internet Aula 03 Celso Olivete Júnior olivete@fct.unesp.br Na aula de hoje... Javascript: introdução, operadores lógicos e matemáticos, comandos condicionais. Javascript:

Leia mais

O que é o JavaScript?

O que é o JavaScript? JavaScript Introdução O JavaScript é utilizado por milhões de páginas na web para melhorar o design, validar forms, e muito mais O JavaScript foi inicialmente desenvolvido pela Netscape e é a linguagem

Leia mais

Introdução. HyperText Markup Language HTML. Formulário. Fluxo do Formulário. Fluxo do Formulário. Fluxo do Formulário. Fluxo do Formulário

Introdução. HyperText Markup Language HTML. Formulário. Fluxo do Formulário. Fluxo do Formulário. Fluxo do Formulário. Fluxo do Formulário Introdução HyperText Markup Language HTML Formulário Prof. Luis Nícolas de Amorim Trigo nicolas.trigo@ifsertao-pe.edu.br http://professor.ifsertao-pe.edu.br/nicolas.trigo/ O usuário interage com os serviços

Leia mais

PHP() é uma linguagem de integração de servidor que permite a criação de paginas dinâmicas. Como todas

PHP() é uma linguagem de integração de servidor que permite a criação de paginas dinâmicas. Como todas O que é PHP? Acrônimo de PHP: Hipertext Language PostProcessor Inicialmente escrita para o desenvolvimento de aplicações Web Facilidade para iniciantes e recursos poderosos para programadores profissionais

Leia mais

Programação Web Prof. Wladimir

Programação Web Prof. Wladimir Programação Web Prof. Wladimir Linguagem HTML Listas e Formulários @wre2008 1 Sumário Listas Revisão da tag Criação de formulários HTML @wre2008 2 Listas As listas são utilizadas para citar, numerar

Leia mais

Java Como Programar, 8/E

Java Como Programar, 8/E Capítulo 2 Introdução aos aplicativos Java Java Como Programar, 8/E (C) 2010 Pearson Education, Inc. Todos os 2.1 Introdução Programação de aplicativo Java. Utilize as ferramentas do JDK para compilar

Leia mais

UENF Curso de Javascript Prof. Sérgio Rodrigues Pg 1 ÍNDICE

UENF Curso de Javascript Prof. Sérgio Rodrigues Pg 1 ÍNDICE UENF Curso de Javascript Prof. Sérgio Rodrigues Pg 1 ÍNDICE Javascript - Módulo I 02 Introdução 02 Escrevendo no documento 02 Criando variáveis 03 Mensagens 04 Alerta 04 Confirmação 04 Receptor 05 Operadores

Leia mais

Utilizando Janelas e Frames

Utilizando Janelas e Frames Utilizando Janelas e Frames Aprenderemos agora algumas técnicas mais específicas para fazer o JavaScript trabalhar com várias partes das páginas e navegadores da Web. Controlando janelas com objetos Já

Leia mais

Mais sobre uso de formulários Site sem Ajax

Mais sobre uso de formulários Site sem Ajax Mais sobre uso de formulários Site sem Ajax Página com busca padrão 1 Página com o resultado da busca carregada no local da anterior (o formulário está vazio) Site com Ajax 2 Site usando Ajax para preencher

Leia mais

Laboratório de Programação I

Laboratório de Programação I Laboratório de Programação I Introdução à Programação em Visual Basic Fabricio Breve Objetivos Ser capaz de escrever programas simples em Visual Basic Ser capaz de usar os comandos de entrada e saída Familiarizar-se

Leia mais

Desenvolvimento Web XHTML Formulários. Prof. Bruno E. G. Gomes

Desenvolvimento Web XHTML Formulários. Prof. Bruno E. G. Gomes Desenvolvimento Web XHTML Formulários Prof. Bruno E. G. Gomes 2014 Introdução Um recurso bastante utilizado no desenvolvimento Web é o envio de dados de uma página para o servidor quando fornecemos informações,

Leia mais

Ferramentas para Multimídia e Internet - 1486

Ferramentas para Multimídia e Internet - 1486 1 Ferramentas para Multimídia e Internet - 1486 HTML BÁSICO: O que é uma página WEB? Uma página WEB, também conhecida pelo termo inglês webpage, é uma "página" na World Wide Web, geralmente em formato

Leia mais

HTML (Hyper Text Markup Language) É a linguagem com que se escrevem as páginas web;

HTML (Hyper Text Markup Language) É a linguagem com que se escrevem as páginas web; HTML Introdução Introdução ao HTML HTML (Hyper Text Markup Language) É a linguagem com que se escrevem as páginas web; É uma linguagem de hipertexto; Permite escrever texto de forma estruturada, que está

Leia mais

Programação Web Prof. Wladimir

Programação Web Prof. Wladimir Programação Web Prof. Wladimir Linguagem PHP @wre2008 1 Sumário PHP: Tipos de dados; Manipulação de dados; Utilizando formulário. @wre2008 2 Tipos de dados As variáveis são declaradas no momento de sua

Leia mais

WEBDESIGN. Professor: Paulo Marcos Trentin - paulo@paulotrentin.com.br http://www.paulotrentin.com.br Escola CDI de Videira

WEBDESIGN. Professor: Paulo Marcos Trentin - paulo@paulotrentin.com.br http://www.paulotrentin.com.br Escola CDI de Videira WEBDESIGN Professor: Paulo Marcos Trentin - paulo@paulotrentin.com.br http://www.paulotrentin.com.br Escola CDI de Videira Formulários e JavaScript Como visto anteriormente, JavaScript pode ser usada para

Leia mais

Características do PHP. Começando a programar

Características do PHP. Começando a programar PHP Introdução Olá pessoal. Desculpe o atraso na publicação da aula. Pude perceber pelas respostas (poucas) ao fórum que a realização da atividade do módulo I foi relativamente tranquila. Assistam ao vídeo

Leia mais

Sintaxe Básica de Java Parte 1

Sintaxe Básica de Java Parte 1 Sintaxe Básica de Java Parte 1 Universidade Católica de Pernambuco Ciência da Computação Prof. Márcio Bueno poonoite@marcioubeno.com Fonte: Material da Profª Karina Oliveira Estrutura de Programa Um programa

Leia mais

Internet e Programação Web

Internet e Programação Web COLÉGIO ESTADUAL PEDRO MACEDO Ensino Profissionalizante Internet e Programação Web 3 Técnico Prof. Cesar 2014 1 SUMÁRIO Criar sites dinâmicos em PHP --------------------------------------------------------

Leia mais

HTML - 7. Vitor Vaz da Silva Paula Graça

HTML - 7. Vitor Vaz da Silva Paula Graça HTML - 7 Vitor Vaz da Silva Paula Graça 1 Formulários Os formulários forms no HTML, são utilizados para a introdução de dados de uma determinada aplicação Os programas JavaScript têm como um dos seus maiores

Leia mais

Programação WEB II. Introdução. Variáveis, Constantes, Operadores, Estruturas de Seleção e Repetição Arrays e Vetores. Thiago Miranda dos Santos Souza

Programação WEB II. Introdução. Variáveis, Constantes, Operadores, Estruturas de Seleção e Repetição Arrays e Vetores. Thiago Miranda dos Santos Souza Introdução Variáveis, Constantes, Operadores, Estruturas de Seleção e Repetição Arrays e Vetores Apresentação Thiago Miranda Email: mirandathiago@gmail.com Site: www.thiagomiranda.net Ementa da Disciplina

Leia mais

INTRODUÇÃO À LINGUAGEM C++

INTRODUÇÃO À LINGUAGEM C++ INTRODUÇÃO À LINGUAGEM C++ 1 - VARIÁVEIS Variáveis espaço de memória reservado para armazenar tipos de dados, com um nome para referenciar seu conteúdo. Observações importantes Todas as variáveis devem

Leia mais

PHP. Hypertext Pre-Processor

PHP. Hypertext Pre-Processor PHP Hypertext Pre-Processor O que é o PHP? Uma linguagem de scripting é uma linguagem cujo código não tem de ser compilado para ser executado! O código escrito é interpretado em tempo de execução para

Leia mais

Java Script Pág: 1. Índice

Java Script Pág: 1. Índice Java Script Pág: 1 Índice Índice... 1 Introdução ao JavaScript Básico... 2 Configurações... 2 Usando o Java Script.... 2 Comandos: script language - alert - /script... 3 Variáveis... 4 Regras para criar

Leia mais

FORMULÁRIOS HTML (FORMS) E ENTRADAS DE DADOS (INPUT)

FORMULÁRIOS HTML (FORMS) E ENTRADAS DE DADOS (INPUT) FORMULÁRIOS HTML (FORMS) E ENTRADAS DE DADOS (INPUT) Formulários (FORMS): Um formulário é uma área que pode conter elementos de formulário. Elementos de formulário são elementos que permitem ao usuário

Leia mais

Exercícios Práticos de HTML e JavaScript. <FORM ACTION="mailto:teste@gmail.com" METHOD="POST" ENCTYPE="text/plain" NAME="cadastro">

Exercícios Práticos de HTML e JavaScript. <FORM ACTION=mailto:teste@gmail.com METHOD=POST ENCTYPE=text/plain NAME=cadastro> Exercícios Práticos de HTML e JavaScript Exercício 1: Formulário Padrão HTML SEM JavaScript

Leia mais

Tecnologias para Web Design

Tecnologias para Web Design Tecnologias para Javascript e DOM Introdução à Scripts Um script do lado cliente é um programa que acompanha um documento HTML Pode estar incluído no próprio documento embutido ou acompanha-lo num arquivo

Leia mais

2. OPERADORES... 6 3. ALGORITMOS, FLUXOGRAMAS E PROGRAMAS... 8 4. FUNÇÕES... 10

2. OPERADORES... 6 3. ALGORITMOS, FLUXOGRAMAS E PROGRAMAS... 8 4. FUNÇÕES... 10 1. TIPOS DE DADOS... 3 1.1 DEFINIÇÃO DE DADOS... 3 1.2 - DEFINIÇÃO DE VARIÁVEIS... 3 1.3 - VARIÁVEIS EM C... 3 1.3.1. NOME DAS VARIÁVEIS... 3 1.3.2 - TIPOS BÁSICOS... 3 1.3.3 DECLARAÇÃO DE VARIÁVEIS...

Leia mais

JavaScript (ou JScript)

JavaScript (ou JScript) 1. Introdução JavaScript (ou JScript) Uma linguagem como o JavaScript permite criar interfaces interativas na web (permite a interação do usuário). Para desenvolver web sites interativos precisamos de

Leia mais

0,5 pelo negrito das palavras ID, Nome, E-mail e Analisar em outro momento.

0,5 pelo negrito das palavras ID, Nome, E-mail e Analisar em outro momento. IFES - Campus Cachoeiro de Itapemirim-ES Curso Técnico em Informática Disciplina: Programação Web Professor: Flávio Izo e Rafael Vargas Data: 07/04/2015 Aluno: GABARITO Valor: 12,5 Conteúdo: HTML + Formulários

Leia mais

APOSTILA PHP PARTE 1

APOSTILA PHP PARTE 1 APOSTILA PHP PARTE 1 1. Introdução O que é PHP? PHP significa: PHP Hypertext Preprocessor. Realmente, o produto foi originalmente chamado de Personal Home Page Tools ; mas como se expandiu em escopo, um

Leia mais

Resumo da Matéria de Linguagem de Programação. Linguagem C

Resumo da Matéria de Linguagem de Programação. Linguagem C Resumo da Matéria de Linguagem de Programação Linguagem C Vitor H. Migoto de Gouvêa 2011 Sumário Como instalar um programa para executar o C...3 Sintaxe inicial da Linguagem de Programação C...4 Variáveis

Leia mais

JavaScript 2.0X 1.0 3.0X 1.1 4.0 4.05 1.2 4.06 4.61 1.3 5.0 1.4 6.0 1.5

JavaScript 2.0X 1.0 3.0X 1.1 4.0 4.05 1.2 4.06 4.61 1.3 5.0 1.4 6.0 1.5 JavaScript Diego R. Frank, Leonardo Seibt FIT Faculdades de Informática de Taquara Fundação Educacional Encosta Inferior do Nordeste Av. Oscar Martins Rangel, 4500 Taquara RS Brasil difrank@terra.com.br,

Leia mais

Introdução aos cálculos de datas

Introdução aos cálculos de datas Page 1 of 7 Windows SharePoint Services Introdução aos cálculos de datas Aplica-se a: Microsoft Office SharePoint Server 2007 Ocultar tudo Você pode usar fórmulas e funções em listas ou bibliotecas para

Leia mais

Universidade Federal do Espírito Santo CCA UFES. Centro de Ciências Agrárias CCA UFES Departamento de Computação. JavaScript

Universidade Federal do Espírito Santo CCA UFES. Centro de Ciências Agrárias CCA UFES Departamento de Computação. JavaScript Universidade Federal do Espírito Santo Centro de Ciências Agrárias CCA UFES Departamento de Computação Universidade Federal do Espírito Santo CCA UFES JavaScript Desenvolvimento de Sistemas para WEB Site:

Leia mais

CAPITULO 5 COMANDO DE FLUXO IF

CAPITULO 5 COMANDO DE FLUXO IF CAPITULO 5 COMANDO DE FLUXO IF Sempre que for necessária a tomada de decisão dentro de um programa, você terá que utilizar um comando condicional, pois é por meio dele que o PHP decidirá que lógica deverá

Leia mais

SIMULADOS & TUTORIAIS

SIMULADOS & TUTORIAIS SIMULADOS & TUTORIAIS TUTORIAIS HTML Como criar formulários em HTML Copyright 2013 Todos os Direitos Reservados Jorge Eider F. da Silva Proibida a reprodução deste documento no todo ou em parte por quaisquer

Leia mais

Introdução ao Javascript. Parte 2 Prof. Victor Hugo Lopes

Introdução ao Javascript. Parte 2 Prof. Victor Hugo Lopes Introdução ao Javascript Parte 2 Prof. Victor Hugo Lopes agenda Estruturas de comandos Modularização A primeira estrutura de comando da linguagem é baseada na noção da estrutura sequencial, no estilo top-down:

Leia mais

Programação WEB II. Formulários Em PHP. Métodos GET e POST progweb2@thiagomiranda.net. Thiago Miranda dos Santos Souza

Programação WEB II. Formulários Em PHP. Métodos GET e POST progweb2@thiagomiranda.net. Thiago Miranda dos Santos Souza Formulários Em PHP Métodos GET e POST progweb2@thiagomiranda.net Conteúdos Os materiais de aula, apostilas e outras informações estarão disponíveis em: www.thiagomiranda.net Objetivos Entender o funcionamento

Leia mais

HTML: Listas, Tabelas e Formulários CST Sistemas para Internet

HTML: Listas, Tabelas e Formulários CST Sistemas para Internet HTML: Listas, Tabelas e Formulários CST Sistemas para Internet Marx Gomes Van der Linden ( Material baseado no original de Marcelo José Siqueira Coutinho de Almeida ) Listas Listas de itens são bastante

Leia mais

Desenvolvido por: Juarez A. Muylaert Filho - jamf@estacio.br Andréa T. Medeiros - andrea@iprj.uerj.br Adriana S. Spallanzani - spallanzani@uol.com.

Desenvolvido por: Juarez A. Muylaert Filho - jamf@estacio.br Andréa T. Medeiros - andrea@iprj.uerj.br Adriana S. Spallanzani - spallanzani@uol.com. UAL é uma linguagem interpretada para descrição de algoritmos em Português. Tem por objetivo auxiliar o aprendizado do aluno iniciante em programação através da execução e visualização das etapas de um

Leia mais

Laboratório 4 Validação do Formulário

Laboratório 4 Validação do Formulário Laboratório 4 Validação do Formulário Introdução Agora que já definimos os nossos documentos usando xhtml e já os embelezámos através da utilização das CSS, está na hora de validar a informação que o utilizador

Leia mais

Curso de Linguagem C

Curso de Linguagem C Curso de Linguagem C 1 Aula 1 - INTRODUÇÃO...4 AULA 2 - Primeiros Passos...5 O C é "Case Sensitive"...5 Dois Primeiros Programas...6 Introdução às Funções...7 Introdução Básica às Entradas e Saídas...

Leia mais

Componentes da linguagem C++

Componentes da linguagem C++ Componentes da linguagem C++ C++ é uma linguagem de programação orientada a objetos (OO) que oferece suporte às características OO, além de permitir você realizar outras tarefas, similarmente a outras

Leia mais

Sumário. Capítulo 1 O que é o PHP?... 19. Capítulo 2 Instalação do PHP... 23. Capítulo 3 Noções básicas de programação... 25

Sumário. Capítulo 1 O que é o PHP?... 19. Capítulo 2 Instalação do PHP... 23. Capítulo 3 Noções básicas de programação... 25 9 Sobre o autor... 8 Introdução... 15 Capítulo 1 O que é o PHP?... 19 Características do PHP...20 Gratuito e com código aberto...20 Embutido no HTML...20 Baseado no servidor...21 Bancos de dados...22 Portabilidade...22

Leia mais

4. A Linguagem JavaScript

4. A Linguagem JavaScript 4. A Linguagem JavaScript! A linguagem XHTML, por não ser uma linguagem de programação e sim uma linguagem de marcação, não permite interação entre o usuário e a página, além de clicar em um link, fazendo

Leia mais

Scriptlets e Formulários

Scriptlets e Formulários 2 Scriptlets e Formulários Prof. Autor: Daniel Morais dos Reis e-tec Brasil Programação Avançada Para Web Página1 Meta Permitir ao aluno aprender a criar um novo projeto Java para web no Netbeans IDE,

Leia mais

Introdução a Javascript

Introdução a Javascript Introdução a Javascript André Tavares da Silva andre.silva@udesc.br Introdução Javascript Javascript é uma linguagem que permite injetar lógica em páginas escritas em HTML Podem estar "soltos" ou atrelados

Leia mais

TECNOLOGIAS WEB AULA 7

TECNOLOGIAS WEB AULA 7 TECNOLOGIAS WEB AULA 7 PROF. RAFAEL DIAS RIBEIRO @RIBEIRORD Objetivos: Apresentar as principais tags utilizadas na construção de formulários em HTML. Compreender as principais estruturas formadas com as

Leia mais

Aluísio Eustáquio da Silva

Aluísio Eustáquio da Silva 1 Aluísio Eustáquio da Silva SciLab Programável Material didático usado em aulas de Programação de Computadores, Algoritmos e Lógica de Programação Betim Maio de 2012 2 PROGRAMAÇÃO O SciLab permite que

Leia mais

Programação Básica em Arduino Aula 2

Programação Básica em Arduino Aula 2 Programação Básica em Arduino Aula 2 Execução: Laboratório de Automação e Robótica Móvel Variáveis são lugares (posições) na memória principal que servem para armazenar dados. As variáveis são acessadas

Leia mais

e à Linguagem de Programação Python

e à Linguagem de Programação Python Introdução a Algoritmos, Computação Algébrica e à Linguagem de Programação Python Curso de Números Inteiros e Criptografia Prof. Luis Menasché Schechter Departamento de Ciência da Computação UFRJ Agosto

Leia mais

Mini-curso de PHP. Aulas ministradas por: André Luis de Paula Arthur Kalsing Diego Silva

Mini-curso de PHP. Aulas ministradas por: André Luis de Paula Arthur Kalsing Diego Silva Mini-curso de PHP Aulas ministradas por: André Luis de Paula Arthur Kalsing Diego Silva Aula 1 Breve introdução de HTML, Conceitos básicos de PHP, Sintaxe, Separador de instruções e Comentários (Cap 1

Leia mais

Mozart de Melo Alves Júnior

Mozart de Melo Alves Júnior Mozart de Melo Alves Júnior WORD 2000 INTRODUÇÃO: O Word é um processador de texto com recursos de acentuação, formatação de parágrafo, estilo de letras diferentes, criação de tabelas, corretor ortográfico,

Leia mais

Índice. 1 Introdução ao Javascript...1 1.1 HTML e Javascript...1 1.2 Resumo do capítulo...2

Índice. 1 Introdução ao Javascript...1 1.1 HTML e Javascript...1 1.2 Resumo do capítulo...2 Índice 1 Introdução ao Javascript...1 1.1 HTML e Javascript...1 1.2 Resumo do capítulo...2 2 Elementos da Linguagem...3 2.1 Variáveis...3 2.2 Tipos de dados...4 2.3 Operadores...4 2.4 Comparação...5 2.5

Leia mais

Faça um Site PHP 5.2 com MySQL 5.0 Comércio Eletrônico

Faça um Site PHP 5.2 com MySQL 5.0 Comércio Eletrônico Editora Carlos A. J. Oliviero Faça um Site PHP 5.2 com MySQL 5.0 Comércio Eletrônico Orientado por Projeto 1a Edição 2 Reimpressão São Paulo 2011 Érica Ltda. Noções Livrarse Preparação muitas muita Sumário

Leia mais

HTML Básico Formulários. Matheus Meira

HTML Básico Formulários. Matheus Meira HTML Básico Formulários Matheus Meira 1 Objetivos Neste apresentação conheceremos os fundamentos básicos de HTML para a manipulação com servlets e jsp. Serão vistos Formulários Links Elementos de disparo

Leia mais

Linguagens de programação

Linguagens de programação Prof. André Backes Linguagens de programação Linguagem de Máquina Computador entende apenas pulsos elétricos Presença ou não de pulso 1 ou 0 Tudo no computador deve ser descrito em termos de 1 s ou 0 s

Leia mais

Programando em PHP. Conceitos Básicos

Programando em PHP. Conceitos Básicos Programando em PHP www.guilhermepontes.eti.br lgapontes@gmail.com Conceitos Básicos Todo o escopo deste estudo estará voltado para a criação de sites com o uso dos diversos recursos de programação web

Leia mais

Curso: Ciência da Computação Disciplina: Construção de Compiladores Período: 2010-1 Prof. Dr. Raimundo Moura

Curso: Ciência da Computação Disciplina: Construção de Compiladores Período: 2010-1 Prof. Dr. Raimundo Moura UFPI CCN DIE Curso: Ciência da Computação Disciplina: Construção de Compiladores Período: 2010-1 Prof. Dr. Raimundo Moura O projeto Desenvolver um compilador de um subconjunto básico da linguagem PORTUGOL.

Leia mais

HTML -- Criação de Home Page

HTML -- Criação de Home Page PPáággi innaa 1 LISTAS Na linguagem HTML existem elementos específicos para a criação de listas, que podem ser listas ordenadas (OL), listas sem ordenação (UL), ou listas de definição (DL). Um detalhe

Leia mais

Conteúdo Programático de PHP

Conteúdo Programático de PHP Conteúdo Programático de PHP 1 Por que PHP? No mercado atual existem diversas tecnologias especializadas na integração de banco de dados com a WEB, sendo o PHP a linguagem que mais se desenvolve, tendo

Leia mais

CURSO DE PROGRAMAÇÃO EM JAVA

CURSO DE PROGRAMAÇÃO EM JAVA CURSO DE PROGRAMAÇÃO EM JAVA Introdução para Iniciantes Prof. M.Sc. Daniel Calife Índice 1 - A programação e a Linguagem Java. 1.1 1.2 1.3 1.4 Linguagens de Programação Java JDK IDE 2 - Criando o primeiro

Leia mais