Você está na página 1de 26

Ferramentas de Construção de Websites

Izequiel Pereira de Norões

Módulo 4 – Javascript
Apresentação
• Professor:
– Izequiel Pereira de Norões
– Bacharel em Informática (Unifor)
– Pós em Gerência Estratégica da Informação (Unifor)
– Pós em Tecnologias da Informação – Ênfase Web (UFC)

Contato: izequiel@gmail.com

Material da disciplina:
http://fatene.ipn.eti.br

Izequiel Pereira de Norões - 2006


Javascript
• Objetivos:
– Apresentar os fundamentos básicos de
criação de websites com Javascript;
– Apresentar uma visão geral da
linguagem;
– Conhecer as principais formas
utilizadas;

Izequiel Pereira de Norões - 2006


JavaScript
• O que é JavaScript?
– É uma linguagem utilizada principalmente
para auxílio de desenvolvimento de
páginas para a Internet.
• JavaScript é a mesma coisa que Java?
– Não, JavaScript é mais simples que Java.
Aprender JavaScript é o melhor começo
se você quer aprender Java, C, C++,
PHP, pois a sintaxe (forma de escrever a
linguagem) é semelhante.

Izequiel Pereira de Norões - 2006


JavaScript x Java
• Compilador. Para programar em Java
necessitamos um Kit de desenvolvimento e um
compilador. Entretanto, Javascript não é uma
linguagem que necessite que seus programas se
compilem, senão que estes se interpretem por
parte do navegador quando este lê a página.
• Orientado a objetos. Java é uma linguagem de
programação orientada a objetos. (Mais tarde
veremos que quer dizer orientado a objetos, para
quem ainda não sabe) Javascript não é orientado a
objetos, isto quer dizer que poderemos programar
sem necessidade de criar classes, tal como se
realiza nas linguagens de programação estruturada
como C ou Pascal.
Izequiel Pereira de Norões - 2006
JavaScript x Java
• Propósito. Java é muito mais potente que Javascript,
isto é devido a que Java é uma linguagem de propósito
geral, com o que se podem fazer aplicações do mais
variado, entretanto, com Javascript somente podemos
escrever programas para que se executem em páginas
web.
• Estruturas fortes. Java é uma linguagem de
programação fortemente tipada, isto quer dizer que ao
declarar uma variável teremos que indicar seu tipo e
não poderá mudar de um tipo a outro
automaticamente. Por sua parte, Javascript não tem
esta característica, e podemos colocar em uma variável
a informação que desejarmos, independentemente do
tipo desta. Ademais, poderemos mudar o tipo de
informação de uma variável quando quisermos.
Izequiel Pereira de Norões - 2006
JavaScript x Java
• Outras características. Como vemos Java é
muito mais complexo, mas também, mais potente,
robusto e seguro. Tem mais funcionalidades que
Javascript e as diferenças que os separam são o
suficientemente importantes como para distinguí-
los facilmente.

Izequiel Pereira de Norões - 2006


JavaScript
• O que posso fazer com o JavaScript?
– Você pode tornar suas páginas mais
"inteligentes", com recursos adicionais como:
botões que mudam ao passar o mouse em cima,
exibir o horário atual, verificar se o
preenchimento de um formulário está correto, e
muito mais! O JavaScript pode lhe salvar nas
horas em que você menos espera, pois as
possibilidades de utilização são infinitas.

Izequiel Pereira de Norões - 2006


JavaScript
• Onde coloco o código JavaScript?
<html>
<body>
<script>
alert("Minha primeira mensagem!")
</script>
</body>
</html>

Izequiel Pereira de Norões - 2006


JavaScript
• Simples código – Valor calculado
<html>
<body>
<script>
a=2
b=9
c=a+b
alert(c)
</script>
</body>
</html>
Izequiel Pereira de Norões - 2006
JavaScript
• Expressão condicional IF
<html>
<body>
<script>
bananas = 6
if (bananas == 6) { alert("É verdade.
Temos meia dúzia de bananas") }
</script>
</body>
</html>
Izequiel Pereira de Norões - 2006
JavaScript
• Expressão condicional IF ELSE
<script>
bananas = 22
if (bananas == 6) {
alert("É verdade. Temos meia dúzia
de bananas") }
else {
alert("Não é verdade. Temos outra
quantidade de bananas") }
</script> Izequiel Pereira de Norões - 2006
JavaScript
• Expressão condicional SWITCH
<script>
farol = "amarelo"
switch (farol) {
case "vermelho": alert("Pare")
break
case "amarelo": alert("Atencao")
break
case "verde": alert("Prossiga")
break
default: alert("Cor ilegal")
}
</script>
Izequiel Pereira de Norões - 2006
JavaScript
• Expressão condicional FOR
<script>
a=2
for (i = 0; i < 2; i++) {
a=i
} alert(a)
</script>

Izequiel Pereira de Norões - 2006


JavaScript
• Expressão WHILE
<script>
a=2
for (i = 0; i < 2; i++) {
a=i
} alert(a)
</script>

Izequiel Pereira de Norões - 2006


JavaScript
• Expressão DO WHILE
<script>
numero = 0
do {
numero++
}
while (numero < 10)
alert(numero)
</script>
Izequiel Pereira de Norões - 2006
JavaScript
• Expressão DO WHILE
<script>
numero = 0
do {
numero++
}
while (numero < 10)
alert(numero)
</script>
Izequiel Pereira de Norões - 2006
JavaScript
• Abrindo uma janela secundária
<script>

window.open("http://www.google.com","","
width=550,height=420,menubar=no")
</script>

Izequiel Pereira de Norões - 2006


JavaScript
• Abrindo uma janela de alerta
<script>
window.alert("Bem-vindo ao meu site web.
Obrigado...")
</script>

Izequiel Pereira de Norões - 2006


JavaScript
• Data atual
<script>
document.write(new Date())
</script>

Izequiel Pereira de Norões - 2006


JavaScript
• Botão voltar
<input type=button value=Atrás
onclick="history.go(-1)">

Izequiel Pereira de Norões - 2006


JavaScript
• Relógio
<script language="JavaScript">
function moveRelogio(){
    momentoAtual = new Date()
    hora = momentoAtual.getHours()
    minuto = momentoAtual.getMinutes()
    segundo = momentoAtual.getSeconds()
    horaImprimivel = hora + " : " + minuto +":
" + segundo
    document.form_relogio.relogio.value =
horaImprimivel
    setTimeout("moveRelogio()",1000)
}
</script>

Izequiel Pereira de Norões - 2006


JavaScript
• Relógio
<body onload="moveRelogio()">
Vemos aqui o relógio funcionando...
<form name="form_relogio">
<input type="text" name="relogio" size="10">

</form>
</body>

Izequiel Pereira de Norões - 2006


JavaScript
• Validação de formulários

Izequiel Pereira de Norões - 2006


JavaScript – Referências
• Links
– www.criarweb.com
– http://www.imasters.com.br
– http://www.plugmasters.com.br
– http://www.javascript.com

Izequiel Pereira de Norões - 2006


Próximo módulo...

Izequiel Pereira de Norões - 2006