Carregar apresentação
A apresentação está carregando. Por favor, espere
1
PrograMação para internet
Prof.: Jean Carlo Mendes
2
JavaScript O HTML é especializado na formatação das páginas Web.
Somente com o HTML não conseguimos, por exemplo, validar os campos de um formulário. Como adição aos recursos do HTML, podemos usar linguagens de script como o VBScript e o JavaScript.
3
JavaScript O JavaScript foi desenvolvido pela Netscape e era compatível com a versão 2.0 do navegador A linguagem VBScript foi desenvolvido pela Microsoft em resposta à Netscape. O VbScript acabou caindo em desuso e o JavaScript tomado como padrão.
4
JavaScript Primeiro deve ficar claro que JavaScript <> Java
O JavaScript é uma linguagem de script que é interpretada pelo browser. É portanto uma linguagem que roda no lado “cliente” de uma aplicação Web. JavaScript é uma linguagem baseada na orientação a objetos, o que significa na prática que os elementos da página são tradados como objetos.
5
JavaScript Existem duas formas para se inserir um código JavaScript em uma página HTML: Usar a tag <script> dentro do cabeçalho da página e então escrever as funções Usar um arquivo externo contendo o código JavaScript e referencia-lo na página em que será usado Primeiramente vamos utilizar a primeira abordagem
6
JavaScript Os códigos JavaScript são acionados à partir de “eventos” que ocorrem na página, como por exemplo: carregamento da página (onLoad), clique de um botão (onClick), o sair do mouse sobre um elemento (onBlur), pressionamento de uma tecla (onKeyDown), etc...
7
JavaScript – Hello World
<HTML> <HEAD> <script type="text/javascript"> function ola() { alert('Ola Mundo'); } </script> </HEAD> <BODY onload=ola();>’ Exemplo Hello World em js. </BODY> </HTML> Exemplo
8
JavaScript – Hello World
É possivel ainda escrever o código JavaScript diretamente em alguns elementos do HTML... Vamos ver o mesmo exemplo anterior com o código direto na tag Body.... <BODY onload=“alert(‘Olá Mundo’)”> Exemplo
9
JavaScript – Hello World
Mais um exemplo simples ... Exemplo
10
JavaScript – Hello World
Mais um exemplo simples ... Exemplo
12
JavaScript – Hierarquia de Objetos
Navigator: Possui propriedades para o nome e para a versão do navegador que está sendo usado. Exemplo Window: É o objeto de mais alto nível. Possui propriedades que se aplicam à janela como um todo.
13
JavaScript – Hierarquia de Objetos
Document: Contêm informações sobre a página (ou documento), incluindo os dados sobre os elementos dos formulários e links. Form: Guarda informações específicas à respeito dos formulários History: Mantêm uma lista de todos os sites visitados na sessão atual do navegador Location: Possui informações sobre o local da página e informações de protocolo e domínio
14
JavaScript – Eventos Os eventos são o principal recurso do JavaScript para a validação de campos e a alteração dinâmica da página.
16
JavaScript – JavaScript possui: Funções: Exemplo: function calculaMedia(num1, num2) { num3 = (num1+num2)/2; return num3; }
17
JavaScript – Variáveis: As variáveis em JS não são tipadas... Nome=“Jean Carlo”; Idade=18; Hoje=date(); O nome de variável deve começar com um caracter ou um “_” seguidos de números ou letras sem espaço. JS é case sensitive
18
JavaScript – Caracteres especiais: \n insere uma quebra de linha \t insere tabulação \r retorna para o inicio da linha \f insere um avanço de página
19
JavaScript – Operadores iguais ao do Java X=20; X=20/10+5; X+=2; X++; ++X; Y--; etc...
20
JavaScript – Operadores iguais ao do Java A=“primeiro”; B=“segundo”; C= primeiro + “ “ + segundo;
21
JavaScript – Estrutura condicional
<script> if (condicao) { executar operacao } else { executa outra operacao } </script>
22
JavaScript – Estrutura condicional
<script> switch(variavel) { case 1: document.write('Opção 1'); break; case 2: document.write('Opção 2'); case 3: document.write('Opção 3'); default: document.write('Padrão'); } </script>
23
JavaScript – Laços de repetição
<script> function escreveLinha() { for (i=0; i<= 10; i++) document.write('Linha '+i + '<br>'); } </script> Exemplo
24
JavaScript – Laços de repetição
<script> function escreveLinha() { var var1; var1=1; while (var1 <= 10) document.write('linha '+var1 + ‘<br>'); var1++; } </script> Exemplo
25
Exercicio – 6 pts – data? (parte 1)
Criar um formulário em HTML contendo os seguintes campos: Nome: Aceitar no máximo 80 caracteres deve e domínio Telefone: pode aceitar apenas números, espaço e parentes ex.: (31) CPF: deve ser válido Validar todos os campos antes de submeter
26
Exercicio – 6 pts – data? (parte 2)
Criar um formulário em HTML contendo os seguintes campos que esteja apto a receber dados para calculo de parcelas de emprestimo. O usuário irá informar o valor total desejado e a quantidade de parcelas. O código javascript deve ser capaz de calcular os juros (compostos) sobre o valor desejado e retornar o valor da parcela (o valor dos juros deve ser distribuído nas parcelas de forma que todas as parcelas tenham o mesmo valor) Apresentar em um “alert” a quantidade e valor das parcelas
Apresentações semelhantes
