Programacao para Internet - Faci - Introducao Ao Javascript

INTRODUÇÃO AO JAVASCRIPT
JavaScript
Linguagem de programação interpretada (scripting),
baseada em objetos e sem declaração de tipos.
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, como:
NotePad; Write, etc.
Porém, existem editores próprios para gerar HTML
1
Os browsers mais divulgados (Internet
Explorer, Netscape, etc.) são
interpretadores de código JavaScript
inserido em páginas HTML.
A linguagem JavaScript foi inicialmente

desenvolvida pela Netscape
Versões da Netscape: versão inicial 1.0, seguiu-se a
1.1, 1.2, 1.3 , 1.4 e 1.5, ... cujos lançamentos foram
coincidido com as várias versões do browser.
A versão standard (ECMAScript)

ECMAScript foi definida
pela ECMA (European Computer Manufacturers
Association)
Association e aprovada pela ISO.
A Microsoft definiu a linguagem JScript que é

uma extensão da ECMAScript, só reconhecida
em ambiente Window
2
Os parágrafos de lógica do javaScript podem
estar "soltos" ou atrelados a ocorrência de
eventos.
- Os parágrafos soltos são executados na
seqüência em que aparecem na página
(documento) e os
- Os atrelados a eventos são executados

apenas quando o evento ocorrer.
Para inserir parágrafos de programação

dentro do HTML é necessário identificar o
início e o fim do set de JavaScript, da
seguinte forma:
<SCRIPT>
Set de instruções
</SCRIPT>
Procedimento a ser adotado em qualquer

local da página.
3
Para melhor visualização e facilidade de
manutenção, recomenda-se que toda a
lógica seja escrita no início do documento.
Funções devem ser invocadas quando se fizer

necessário (normalmente atreladas a eventos).
Se a lógica é escrita a partir de um determinado

evento, não é necessário o uso dos comandos
<SCRIPT> e </SCRIPT>.
Os comandos JavaScript são sensíveis ao tipo de

letra (maiúsculas e minúsculas) em sua sintaxe –
case sensitive.
4
Observação importante:
Se houver
erro de sintaxe no comando, o
o JavaScript interpretará, o comando, como
sendo o nome de uma variável.
OPERADORES LÓGICOS
Os operadores a serem utilizados em comandos (IF ,
FOR e WHILE) são os seguintes:
• = = Igual
• != Diferente
• > Maior
• >= Maior ou Igual
• < Menor
• <= Menor ou Igual
• && E
• || Ou
10
5
OPERADORES MATEMÁTICOS
Operadores a serem utilizados:
• + adição de valor e concatenação de strings

• - subtração de valores
• * multiplicação de valores
• / divisão de valores
• % obtém o resto de uma divisão:
Ex: 150 % 13 retornará 7
7 % 3 retornará 1
11
OPERADORES MATEMÁTICOS
• += concatena/adiciona à string/valor já existente.
Ex: x += y é o mesmo que x = x + y

da mesma forma podem ser utilizados:
-= , *= , /= ou %=.
Um contador pode ser simplificado utilizando-se :
X++ ou X--
o que equivale as expressões:
X = X + 1 ou X = X - 1 respectivamente.
Para inverter sinal: X = -X ( - + ou + -).
12
6
CONTROLES ESPECIAIS
\b - backspace
\f - form feed
\n - new line caracters
\r - carriage return
\t - tab characters
// - Linha de comentário
/*....*/ - Delimitadores para inserir um texto com mais de uma
linha como comentário.
Os delimitadores naturais para uma string são: " ou ' .
Para utilizar estes caracteres como parte da string, utilize:
\ precedendo " ou '.
Ex. alert (“Experimente o uso de \" ou \' em uma string")
13
COMANDOS CONDICIONAIS
Tarefas a serem executadas ou não, dependendo da
veracidade ou não de uma condição, ou enquanto esta for
verdadeira.
Comando IF
if (condição)
{ ação para condição satisfeita }
[ else
{ ação para condição não satisfeita } ]
Ex.
if (Idade < 18)
{Categoria = "Menor" }
else
{Categoria = "Maior"}
14
7
COMANDOS CONDICIONAIS
Move condicional
receptor = ( (condição) ? verdadeiro : falso)
Ex.
NomeSexo = ((VarSexo == "M") ? "Masculino"
: "Feminino")
15
COMANDOS REPETIÇÃO
Comando FOR
for ( [inicialização/criação de variável
de controle ;]
[condição ;]
[incremento da variável de controle] )
{ ação }
Ex.
for (x = 0 ; x <= 10 ; x++)
{alert ("X igual a " + x) }
16
8
COMANDOS REPETIÇÃO
ComandoWHILE
Executa uma ação enquanto determinada
condição for verdadeira.
while (condição)
{ ação }
Ex.
var contador = 10
while (contador > 1)
{ contador-- }
17
IMPORTANTE SABER
Em FOR e WHILE:
pode-se usar a diretiva "break" para
interromper a condição principal e sair do
loop;
e a diretiva "continue“ para interromper uma
ação (se determinada condição ocorrer) e
voltar para o loop.
Diretivas/condições entre [ ] são opcionais.
18
9
EVENTOS
São fatos que ocorrem durante a execução
do sistema, a partir dos quais o programador
pode definir ações a serem realizadas pelo
programa.
Segue exemplo...
19
Associando código JavaScript ao

clique no botão <html>
<head>
<title>Clicar no botão</title>
</head>
<body>
<input type="button"
value="Clique aqui"
onclick='alert("Ola");'
/>
</body>
</html>
Quando for dado um clique no
botão é executado o código (em
JavaScript), neste caso:
alert("Ola");
20
10
Eventos
Um evento é gerado como resultado de uma ação:
Um clique,
Um movimento do mouse,
Uma seleção de texto,
O abandono da página
etc.
O tratamento de eventos é feito por partes de código

associadas a eventos específicos
21
A associação é realizada em HTML nos

elementos que suportam eventos do tipo Event
através dos atributos: onEvent
Exemplo:
<input type = "button" onclick =

'alert("Ola");' />
22
11
Eventos
- Eventos possíveis;
- Momentos em que os mesmos ocorrem;
- Objetos que possibilitam a sua ocorrência.
23
onload - Ocorre na carga do documento. Ou

seja, só ocorre no BODY do
documento.
onunload - Ocorre na descarga (saída) do
documento. Também só ocorre
no BODY.
onchange - Ocorre quando o objeto perde o
focus e houve mudança de
conteúdo.
Válido para os objetos Text, Select e Textarea.
24
12
onblur - Ocorre quando o objeto perde o focus,
independente de ter havido mudança.
onfocus - Ocorre quando o objeto recebe o

focus.
onclick - Ocorre quando o objeto recebe um

Click do Mouse.
Válido para os objetos Buton, Checkbox, Radio,
Link, Reset e Submit.
25
onmouseover - Ocorre quando o ponteiro do

mouse passa por sobre o
objeto.
Válido apenas para Link.
onselect - Ocorre quando o objeto é

selecionado.
Válido para os objetos Text e Textarea.
onsubmit- Ocorre quando um botão tipo

Submit recebe um click do mouse.
Válido apenas para o Form.
26
13
Eventos dos objetos HTML
Objetos com representação visual
Todos exceto: <br>, <head>, <html>, <script>, <style>, <title>
onclick Clique no botão mouse

ondblclick Duplo clique no mouse
onkeydown Tecla pressionada
onkeypress Tecla pressionada e liberada
onkeyup Tecla liberada
onmousedown Botão do mouse pressionado
onmouseup Botão do mouse libertado
onmouseover Mouse sobre o objeto
onmousemove Mouse movido do objeto
onmouseout Mouse saiu do objeto
27
Eventos dos objetos HTML

<a>,<input>,<select>,<textarea>
onfocus Ganha o foco
onblur Perde o foco
<body> -
onload Na carga do documento
onunload Na descarga do documento (saída)
<input>, <select>, <textarea>
onchange O conteúdo foi alterado
onselect Texto foi selecionado
28
14
Associando código JavaScript ao
carregamento <html>
<head>
<title>Clicar no
Quando o documento for botão</title>
carregado (a página estiver </head>
visível) é chamada a função <body onload = 'load()' >
load() <input type="button"
value="Clique aqui"
onclick= 'touch()'
/>
</body>
</html>
29
Variáveis
Pode-se armazenar valores de qualquer tipo, por exemplo:
strings ou valores numéricos
Enquanto não forem iniciadas (1ª atribuição) armazenam o valor
especial: undefined <html>
<head>
Definição da variável <title>Clicar no botão</title>
var nome [ = expressão ] ; <script>
var mensage; //Para guardar o
Afetar a variável nome
function load() {
Consultar a variável mensage = prompt(“Seu nome?");
}
function touch() {
alert(mensage);
}
</script>
</head>
30
15
<html>
<head>
<script>
var mensage; //Para guardar o nome
function load() {
mensage = prompt("Seu nome?");
}
function touch() {
alert(mensage);
}
</script>
</head>
<body onload ='load()' >
value="Clique aqui"
onclick='touch()'
/>
</body>
</html>
31
CRIANDO VARIÁVEIS
Variável é criada automaticamente, pela simples
associação de valores a mesma.
Ex. NovaVariavel = "Jose"
Foi criada a variável de nome NovaVariavel que,

passou a conter a string Jose.
As variáveis podem ser Locais ou Globais.

Locais - variáveis que são criadas dentro de uma
função e referenciáveis apenas dentro da função.
Globais - variáveis criadas fora de funções, podendo
ser referenciadas em qualquer parte do documento.
32
16
CRIANDO VARIÁVEIS
Obs:
A variável deverá ser definida como global se
for referenciada:
- por várias funções ou
- ou em uma parte do documento
33
CRIANDO VARIÁVEIS
Ex.
MinhaVariavel = “”
ou
var MinhaVariavel = “”.
34
17
Palavras reservadas
break delete function return typeof
case do if switch var
catch else in this void
continue false instanceof throw while
debugger finally new true with
default for null try
abstract double goto native static
boolean enum implements package super
byte export import private synchronize
char extends int protected d
throws
class final interface public transient
const float long short volatile
35
Objetos em JavaScript
Um objeto é uma coleção de propriedades
Cada propriedade tem um nome
• As propriedades armazenam valores que podem ser lidos
ou escritos.
• As propriedades que armazenam funções denominam-se
métodos, que podem ser chamados.
obj.prop Nome da propriedade
Nome do objeto
obj.method
(argumentos) Nome do método
36
18
Acessando o objeto document
Comentário de fim de linha
O documento HTML é ... // comentário
representado pelo objeto
document <html>
<head>
O objeto document tem <title>Clicar no botão</title>
várias propriedades, por <script>
exemplo: // Escreve o titulo
function touch() {
alert( document.title );
Nome Descrição }
title Título do documento </script>
</head>
url Endereço da página ...
Acesso a propriedade
objeto.propriedade
37
Objetos predefinidos
Existem três tipos de objetos:
• Intrínsecos da linguagem (ex: String, Math)
• Fornecidos pelo browser (ex: window, navigator)
• Criados pelo código em JavaScript.
O objeto window é usado quando nenhum objeto for

explicitamente indicado. Por exemplo:
• alert é um método de window
alert("ola") é equivalente a
window.alert("ola")
• document é uma propriedade de window
document.title é equivalente a
window.document.title
38
19
ESCREVENDO NO DOCUMENTO
O JavaScript permite que o programador escreva
linhas dentro de uma página (documento), através
do método write.
As linhas escritas desta forma, podem conter:
textos, expressões JavaScript e comandos Html.
As linhas escritas através deste método aparecerão
no ponto da tela onde o comando for inserido.
Ex:
<script>
valor = 30;
document.write ("Minha primeira linha");
document.write ("Nesta linha aparecerá o resultado
de : " + (10 * 10 + valor));
</script>
39
Estudando o caso:
Método write não insere mudança de linha:
Surgirá apenas uma linha com os dois textos

emendados.
Para evitar isto, utiliza-se o método writeln

que escreve uma linha e espaceja para a
seguinte.
40
20
Este comando não causa efeito de mudança
de linha.
A solução é utilizar o comando de mudança
de parágrafo da linguagem Html.
Ex:
<script>
valor = 30;
document.write ("<p>Minha primeira linha</p>");
document.write ("<p>Nesta linha aparecerá o resultado
de : " + (10 * 10 + valor) + "</p>");
</script>
41
Resolve-se a questão da mudança de linha, porém,

gera-se uma linha em branco, entre cada linha, por se
tratar de mudança de parágrafo.
A alternativa é utilizar o comando Html <br> que apenas
muda de linha.
Ex:
<script>
valor = 30;
document.write ("<br>Minha primeira linha") ;
document.write ("<br>Nesta linha aparecerá o resultado de : " +
(10 * 10 + valor) );
</script>
42
21
MENSAGENS
Formas de comunicação com o usuário:
1. Apenas Observação.
alert ( mensagem );
Ex.
alert ("Certifique-se de que as informações estão corretas")
2. Mensagem que retorna confirmação de OK ou CANCELAR

confirm (mensagem);
Ex.
if (confirm ("Algo está errado...devo continuar??"))
{ alert("Continuando"); }
else
{ alert("Parando"); }
43
3. Recebe mensagem via caixa de texto Input

Receptor = prompt ("Minha mensagem", "Meu texto")
Onde:
Receptor é a variável que vai receber a informação digitada
pelo usuário
Minha mensagem é a mensagem que vai aparecer como
Label da caixa de input
Meu texto é um texto, opcional, que aparecerá na linha de
digitação do usuário
Ex.
Entrada = prompt("Informe uma expressão matemática", "");
Resultado = eval(Entrada);
document.write("O resultado é = " + Resultado);
44
22
FUNÇÕES
Uma função é uma seqüência de instruções,
que só deve ser executada quando a função
for acionada.
A sintaxe geral é a seguinte:
45
Funções
<html>
function nome(argumentos)
<head>
{
sequência de instruções
<script type="text/javascript"
}
>
function touch() {
Área de definição de código alert("Ola");
}
(em JavaScript)
</script>
A função touch não tem </head>
<body>
argumentos e contém uma só
instrução
value="Clique aqui"
onclick='touch();' />
Chamada a função </body>
nome(argumentos) </html>
A função alert tem um argumento:

string com o texto a apresentar
46
23
Suponha uma função que tenha como objetivo
informar se uma pessoa é maior ou menor de
idade, recebendo como parâmetro a sua idade.
function Idade (Anos) {

if (Anos > 17)
{ alert ("Maior de Idade"); }
else
{ alert (“Menor de Idade"); }
}
47
Para acionar esta função, suponha uma

caixa de texto, em um formulário, na qual
seja informada a idade e, a cada informação,
a função seja acionada.
<form>
<input type=text size=2 maxlength=2
name="Tempo"
onchange="Idade(Tempo.value)">
</form>
48
24
<html> <body>
<head> <form>
<script> <input type=text size=2 maxlength=2
function Idade (Anos) { name="Tempo"
if (Anos > 17)
{ alert ("Maior de Idade"); } onchange="Idade(Tempo.value)">
else </form>
{ alert ("Menor de Idade"); } </body>
}
</script> </html>
</head>
Não existe co-relação O parâmetro passado (no

entre o nome da evento "onchange")
variável passada e a é o conteúdo da caixa
variável de recepção na de texto "Tempo"
função. (propriedade "value") que
Apenas o na função foi chamado de
conteúdo é passado. "Anos".
49
<html>
<head>
<script>
function Idade (Anos) {
if (Anos > 17)
{ alert ("Maior de Idade"); }
else
{ alert ("Menor de Idade"); }
}
</script>
</head>
<body>
<form>
<input type=text size=2 maxlength=2 name="Tempo"
onchange="Idade(Tempo.value)">
</form>
</body>
</html>
50
25
FUNÇÕES INTRÍNSECAS
São funções embutidas na própria linguagem.
Result = função (informação a ser processada)
- eval - Calcula o conteúdo da string

- parseInt - Transforma string em inteiro
- parseFloat - Transforma string em
número com ponto flutuante
- date() - Retorna a data e a hora
51
FUNÇÕES INTRÍNSECAS
ex1: Result = eval ( " (10 * 20) + 2 - 8");
Result = 194
ex2: Result = eval (string);

Depende do conteúdo da string, que também
pode ser o conteúdo (value) de uma caixa de
texto.
52
26
Funções tipicamente Matemáticas
Math.abs(número) - retorna o valor absoluto do número
(ponto flutuante)
Math.ceil(número) - retorna o próximo valor inteiro maior
que o número
Math.floor(número) - retorna o próximo valor inteiro
menor que o número
Math.round(número) - retorna o valor inteiro,
arredondado, do número
Math.pow(base, expoente) - retorna o cálculo do
exponencial
Math.max(número1, número2) - retorna o maior número
dos dois fornecidos
Math.min(número1, número2) - retorna o menor número
dos dois fornecidos
53
Math.sqrt(número) - retorna a raiz quadrada do

número
Math.SQRT2 - retorna a raiz quadrada de 2
(aproximadamente 1.414)
Math.SQRT_2 - retorna a raiz quadrada de 1/2
Math.sin(número) - retorna o seno de um número
(anglo em radianos)
Math.asin(número) - retorna o arco seno de um
número (em radianos)
Math.cos(número) - retorna o cosseno de um número
(anglo em radianos)
54
27
Math.acos(número) - retorna o arco cosseno de um

Math.tan(número) - retorna a tangente de um número
(anglo em radianos)
Math.atan(número) - retorna o arco tangente de um
Math.pi - retorna o valor de PI (aproximadamente
3.14159)
Math.log(número) - retorna o logarítmo de um número
Math.E - retorna a base dos logarítmos naturais
aproximadamente 2.718)
55

Math.LN2 - retorna o valor do logarítmo de 2
Math.LOG2E - retorna a base do logarítmo de 2
Math.LN10 - retorna o valor do logarítmo de 10
Math.LOG10E - retorna a base do logarítmo de 10
Observação:
Nas funções, "(número)", refere-se a um argumento que
será processado pela função e que pode ser:
um número,uma variável ou o conteúdo de um
objeto (propriedade value).
56
28
CRIANDO NOVAS INSTÂNCIAS
Através do operador new podem ser criadas novas
instâncias a objetos já existentes, mudando o seu
conteúdo, porém, mantendo suas propriedades.
NovoObjeto = new ObjetoExistente (parâmetros);
Ex1.
MinhaData = new Date ();
MinhaData passou a ser um objeto tipo Date, com o

mesmo conteúdo existente em Date (data e hora atual)
57

Ex2:
MinhaData = new Date(1996, 05, 27)
MinhaData passou a ser um objeto tipo Date, porém,
com o conteúdo de uma nova data.
Ex3: Registro
Suponha a existência do seguinte objeto chamado
Empresas
function Empresas (Emp, Nfunc, Prod) {

this.Emp = Emp;
this.Nfunc = Nfunc;
this.Prod = Prod;
}
58
29
Podemos criar novas instâncias, usando a mesma

estrutura, da seguinte forma:
Elogica = new Empresas("Elogica", "120", "Serviços");

Pitaco = new Empresas("Pitaco", "35", "Software");
Corisco = new Empresas("Corisco", "42", "Conectividade");
A variável Elogica.Nfunc tem o conteúdo igual a120
59
MANIPULANDO ARRAYS ?????

O JavaScript não tem um tipo de dado ou
objeto para manipular arrays.
arrays
É necessário criar um objeto com a
propriedade de criação de array.
Exemplo:
Um objeto tipo array de tamanho variável e com
a função de "limpar" o conteúdo das variáveis
cada vez que uma nova instância seja criada a
partir dele.
60
30
MANIPULANDO ARRAYS ?????
function CriaArray (n) {

this.length = n;
for (var i = 1 ; i <= n ; i++) {
this[i] = “”;
}
}
61
Criando novas instâncias do objeto "CriaArray" e

alimentando-os com novos dados.
1.
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”;
62
31
2.
atividade = new CriaArray(5);
atividade[0] = “Analista”;
atividade[1] = “Programador”;
atividade[2] = “Operador”;
atividade[3] = “Conferente”;
atividade[4] = “Digitador”;
63
Para obter dados diretamente dos arrays.

diaSemana = nomeDia[4];
ocupacao = atividade[1];
diaSemana passaria a conter Quinta e
Ocupacao conteria Programador.
Outra forma:
Criar novas instâncias dentro do próprio
objeto do array, o que proporciona o mesmo
efeito de se trabalhar com matriz.
Isso pode ser feito da seguinte forma:
64
32
function Empresas (Emp, Nfunc, Prod) {
this.Emp = Emp;
this.Nfunc = Nfunc;
this.Prod = Prod;
}
TabEmp = new Empresas(3);
TabEmp[1] = new Empresas("Elogica", "120","Serviços");
TabEmp[2] = new Empresas("Pitaco", "35","Software");
TabEmp[3] = new Empresas("Corisco", "42","Conectividade");
65
Então: Atividade = TabEmp[3].Prod;
Obtém a atividade da empresa número 3, cuja

resposta é Conectividade:
Obs:
É importante lembrar que, embora os exemplos
estejam com indexadores fixos, os indexadores
podem ser referências ao conteúdo de
variáveis (value).
66
33
MANIPULANDO STRING's
O JavaScript é bastante poderoso no manuseio de
String´s, fornecendo ao programador uma total
flexibilidade em seu manuseio.
Métodos disponíveis para manuseio de string´s:
string.length - retorna o tamanho da string
(quantidade de bytes)
string.charAt(posição) - retorna o caracter da
posição especificada (inicia em 0)
string.indexOf("string") - retorna o número da
posição onde começa a primeira "string"
67
string.lastindexOf("string") - retorna o
número da posição onde começa a última
"string"
string.substring(index1, index2) - retorna o
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.
68
34
Ex.
Todo = "Elogica"
Parte = Todo.substring(1, 4)
(A variável Parte receberá a palavra log)
string.toUpperCase() - Transforma o conteúdo da

string para maiúsculo (Caixa Alta)
string.toLowerCase() - Transforma o conteúdo da
string para minúsculo (Caixa Baixa)
escape ("string") - retorna o valor ASCII da string
(vem precedido de %)
unscape("string") - retorna o caracter a partir de
um valor ASCII (precedido de %)
69
MANIPULANDO DATAS
Existe apenas uma função para se 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
Ex.
Fri May 24 16:58:02 1996
70
35
Para se obter os dados separadamente, usa-se o
método get:
getDate() - Obtém o dia do mês (numérico de 1 a 31)
getDay() - Obtém o dia da semana (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)
71
Exemplo: Obter o dia da semana.

Para tal, utilizar a variável DataToda
para armazenar data/hora e a
variável DiaHoje para armazenar o
número do dia da semana.
DataToda = new Date()

DiaHoje = DataToda.getDay()
72
36
Gerando uma tabela com os dias da semana
e utilizando a variável DiaHoje como
indexador, para obter o dia da semana.
function CriaTab (n) {

this.length = n
for (var x = 1 ; x<= n ; x++)
{ this[x] = "" }
}
NomeDia = new CriaTab(7)
73
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[DiaHoje]
74
37
método set
Cria uma variável tipo Date com o conteúdo
informado pela aplicação.
São eles:
setDate, setDay, setMonth, setYear,
setHours, setMinutes e setSeconds.
Mudar o mês para novembro:
DataToda.setMonth(10)
75
38

Programacao para Internet - Faci - Introducao Ao Javascript

Enviado por

Dados do documento

Título original

Direitos autorais

Formatos disponíveis

Compartilhar este documento

Compartilhar ou incorporar documento

Opções de compartilhamento

Você considera este documento útil?

Este conteúdo é inapropriado?

Direitos autorais:

Formatos disponíveis

Programacao para Internet - Faci - Introducao Ao Javascript

Enviado por

Direitos autorais:

Formatos disponíveis

INTRODUÇÃO AO JAVASCRIPT

Permite injetar lógica em páginas escritas em HTML

As páginas HTML podem ser escritas utilizando-se

Porém, existem editores próprios para gerar HTML

A linguagem JavaScript foi inicialmente

A versão standard (ECMAScript)

A Microsoft definiu a linguagem JScript que é

- Os atrelados a eventos são executados

Para inserir parágrafos de programação

Procedimento a ser adotado em qualquer

Funções devem ser invocadas quando se fizer

Se a lógica é escrita a partir de um determinado

Os comandos JavaScript são sensíveis ao tipo de

o JavaScript interpretará, o comando, como

sendo o nome de uma variável.

• + adição de valor e concatenação de strings

Ex: x += y é o mesmo que x = x + y

Associando código JavaScript ao

Uma seleção de texto,

O tratamento de eventos é feito por partes de código

A associação é realizada em HTML nos

<input type = "button" onclick =

- Momentos em que os mesmos ocorrem;

- Objetos que possibilitam a sua ocorrência.

onload - Ocorre na carga do documento. Ou

onfocus - Ocorre quando o objeto recebe o

onclick - Ocorre quando o objeto recebe um

onmouseover - Ocorre quando o ponteiro do

onselect - Ocorre quando o objeto é

onsubmit- Ocorre quando um botão tipo

onclick Clique no botão mouse

Eventos dos objetos HTML

<input>, <select>, <textarea>

onchange O conteúdo foi alterado

onselect Texto foi selecionado

Foi criada a variável de nome NovaVariavel que,

As variáveis podem ser Locais ou Globais.

obj.prop Nome da propriedade

O objeto window é usado quando nenhum objeto for

Método write não insere mudança de linha:

Surgirá apenas uma linha com os dois textos

Para evitar isto, utiliza-se o método writeln

Resolve-se a questão da mudança de linha, porém,

2. Mensagem que retorna confirmação de OK ou CANCELAR

3. Recebe mensagem via caixa de texto Input

A função alert tem um argumento:

function Idade (Anos) {

Para acionar esta função, suponha uma

Não existe co-relação O parâmetro passado (no

Result = função (informação a ser processada)

- eval - Calcula o conteúdo da string

ex2: Result = eval (string);

Funções tipicamente Matemáticas

Math.sqrt(número) - retorna a raiz quadrada do

Math.acos(número) - retorna o arco cosseno de um

Funções tipicamente Matemáticas

MinhaData passou a ser um objeto tipo Date, com o

CRIANDO NOVAS INSTÂNCIAS

function Empresas (Emp, Nfunc, Prod) {

Podemos criar novas instâncias, usando a mesma

Elogica = new Empresas("Elogica", "120", "Serviços");

A variável Elogica.Nfunc tem o conteúdo igual a120

MANIPULANDO ARRAYS ?????