11

Click here to load reader

Módulo: 5 – Desenvolvimento de Páginas Web Dinâmicas: Javascript

Embed Size (px)

DESCRIPTION

Curso Técnico de Gestão e Programação de Sistema Informáticos, ano lectivo 2010/2011.

Citation preview

Page 1: Módulo: 5 – Desenvolvimento de Páginas Web Dinâmicas: Javascript

Agrupamento de Escolas da Batalha

Miguela Fernandes

Janeiro 2011

Page 2: Módulo: 5 – Desenvolvimento de Páginas Web Dinâmicas: Javascript

Sumário

Iremos abordar:

O que é o Javascript?

Javascript ≠ Java

O que faz o Javascript?

O que não faz o Javascript?

Javascript e AJAX

Exercício prático

MF. 2

Page 3: Módulo: 5 – Desenvolvimento de Páginas Web Dinâmicas: Javascript

O que é Javascript?

o Uma linguagem de programação que proporciona interactividade às páginas web;

o Linguagem script (não necessita de compilador);

o Um script em Javascript é um programa que se inclui (ou num ficheiro externo) numa página HTML;

o Os scripts em Javascript são texto (código) colocados numa página web interpretados e executados pelos browsers.

MF. 3

Page 4: Módulo: 5 – Desenvolvimento de Páginas Web Dinâmicas: Javascript

Javascript ≠ Java

o Java é uma linguagem diferente (Netscape)

o São duas técnicas diferentes de programação na Internet:

– Java é uma linguagem de programação.

– JavaScript é uma linguagem de scripting (tal como diz o nome). Embebed numa página web.

MF. 4

Page 5: Módulo: 5 – Desenvolvimento de Páginas Web Dinâmicas: Javascript

O que faz o Javascript?

o Cria um interface com o utilizador activo;

o Pode validar dados introduzidos em formulários (form);

o Permite personalizar página HTML no momento, com base: nos dados introduzidos, cookies, no dia de semana, na semana, da localização, entre outras;

o Pode controlar os browsers (utilizador pode permitir ou não);

MF. 5

Page 6: Módulo: 5 – Desenvolvimento de Páginas Web Dinâmicas: Javascript

O que não faz o Javascript?

o Não permite comunicar com uma base de dados;

o Não pode escrever em ficheiro (fora dos cookies);

o Não permite manter contadores;

o Não permite guardar o “rasto” (excepto com cookies);

MF. 6

Page 7: Módulo: 5 – Desenvolvimento de Páginas Web Dinâmicas: Javascript

Controlar a experiência do utilizador

o Conhecer a experiência:

– Obter conteúdos diferentes com base no dia, tempo, browser, ente outros;

o Expandir a experiência:

– Páginas dinâmicas sem CGI

– Elementos do UI (user interface): elemento que reagem ao input do utilizador;

– Menus de navegação popup;

o Validação do input

MF. 7

Page 8: Módulo: 5 – Desenvolvimento de Páginas Web Dinâmicas: Javascript

Onde colocar o Javascript?

o Dentro do ficheiro HTML

– No HEAD

– No BODY

o Num ficheiro externo

– Preferível, pelas mesmas razões das CSS

MF. 8

Page 9: Módulo: 5 – Desenvolvimento de Páginas Web Dinâmicas: Javascript

Javascript: exemplo

<html>

<head>

<title>Javascript</title>

</head>

<body>

<h1>Em HTML</h1>

<h1>

<script type="text/javascript">

document.write(“Agora em JavaScript");

</script>

</h1>

</body>

</html>MF. 9

Page 10: Módulo: 5 – Desenvolvimento de Páginas Web Dinâmicas: Javascript

Exercício prático

oCria uma página web que dê como Output:

MF. 10

Este é a minha primeira página Web.Com Javascript, claro!

Page 11: Módulo: 5 – Desenvolvimento de Páginas Web Dinâmicas: Javascript

Webgrafia e Bibliografia

o http://www.w3schools.com/js/js_intro.asp

o Teagu, J. C. (2004). DHTML and CSS for the World Wide Web (2ª Ed.). USA:Peachpit Press.

MF. 11