JavaScript

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: [email protected] Material da disciplina:

http://fatene.ipn.eti.br 

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;

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.

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

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.. web • Estruturas 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.

JavaScript x Java • Outras características 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.

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.

JavaScript • Onde coloco o código JavaScript?

<script> alert("Minha primeira mensagem!")

JavaScript • Simples código – Valor calculado <script> a=2 b=9 c=a+b alert(c)

JavaScript • Expressão condicional IF

<script> bananas = 6 if (ban (banan anas as == == 6) { ale alert( rt("É "É verd verdade ade.. Temos meia dúzia de bananas") }

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") }

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") }

JavaScript • Expressão condicional FOR

<script> a=2 for (i = 0; i < 2; i++) { a=i } alert(a)

JavaScript • Expressão WHILE

<script> a=2 for (i = 0; i < 2; i++) { a=i } alert(a)

JavaScript • Expressão DO WHILE

<script> numero = 0 do { numero++ } while (numero < 10) alert(numero)

JavaScript • Expressão DO WHILE

<script> numero = 0 do { numero++ } while (numero < 10) alert(numero)

JavaScript • Abrindo uma janela secundária

<script> window.open("http://www.google.com"," window.open("http://www.go ogle.com",""," "," width=550,height=420,menub width=550,he ight=420,menubar=no") ar=no")



JavaScript • Abrindo uma janela de alerta

<script> window.alert("Bem-vindo ao meu site web. window.alert("Bem-vindo Obrigado...")



JavaScript • Data atual

<script> document.write(new Date())

JavaScript • Botão voltar

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) }

+":

JavaScript • Relógio Vemos aqui o relógio funcionando...

JavaScript • Validação de formulários

JavaScript – Referências • Links – – – –

www.criarweb.com http://www.imasters.com.br http://www.plugmasters.com.br http://www.javascript.com

Próximo módulo...