AULA 1
JavaScript
JavaScript é a linguagem de programação da Web.
Todas as páginas HTML atuais têm JavaScript.
JavaScript é fácil de aprender.
JavaScript é uma das 3 linguagens que todos os desenvolvedores WEB devem aprender:
-
HTML para definir o conteúdo das páginas WEB
-
CSS para especificar o layout das páginas WEB
-
JavaScript para programar o comportamento das páginas WEB.
Porquê usar JavaScript se existem tantas outras tecnologias para gerar conteúdo dinâmico?
Exercício 1.1 - Enviar o exercício para o mail do professor: colegio.gpsi@gmail.com
Escreva um artigo que exponha as diferenças entre tecnologias Client-Side e tecnologias Server-side. Complemente o artigo com exemplos.
Exercício 1.2 - Enviar o exercício para o mail do professor: colegio.gpsi@gmail.com
Escreva um artigo sobre as potencialidades do JavaScript.
AULA 2
Introdução ao JavaScript
Onde escrever o código do JavaScript?
O Javascript no <head> ou no <body>
Podes escrever vários códigos Javascript no <body>, na secção do <head>, numa página HTML, ou em ambos os sítios.
Manter o código no mesmo sítio é sempre um bom hábito.
Neste exemplo, a função Javascript está escrita na secção <head> de uma página HTML
Esta função é chamada quando o botão é clicado
Neste exemplo, a função Javascript está escrita na secção <body> de uma página HTML
Esta função é chamada quando o botão é clicado
O Javascript num ficheiro externo
-
Os scripts também podem ser colocados em ficheiros externos.
-
Tem avantagem quando se tem de usar o mesmo código Java em várias páginas web diferentes.
-
Os ficheiros externos de Javascript tem a extensão .js
Para usar um script externo, coloque o nome do ficheiro script no atributo scr (source) dentro da tag <script>
O que o JavaScript pode fazer?
JavaScript pode alterar o conteúdo do HTML
JavaScript pode alterar os atributos do HTML
JavaScript pode alterar o estilo do CSS
JavaScript pode validar uma entrada de dados
Saída de dados (Output) no JavaScript
Variáveis
Saída de dados numa janela "alert box" - window.alert()
Saída de dados dentro do HTML - document.write()
Saída de dados num elemento do HTML - innerHTML
VER MAIS... acerca das saídas de dados
Exercício 2.1 - Enviar o exercício para o mail do professor: colegio.gpsi@gmail.com
JavaScript: Ao clicar num botão com o titulo "Ver meu nome" deverá mostrar o teu nome completo
Exercício 2.2 - Enviar o exercício para o mail do professor: colegio.gpsi@gmail.com
JavaScript: validar a entrada de um valor numérico entre 100-200
Exercício 2.3 - Enviar o exercício para o mail do professor: colegio.gpsi@gmail.com
JavaScript: Ao clicar num botão deverá alterar o texto de um parágrafo com a seguinte formatação do texto:
- tamanho da fonte: 20px
- cor da fonte: azul
Exercício 2.4 - Enviar o exercício para o mail do professor: colegio.gpsi@gmail.com
JavaScript: Subtrair o ano corrente ao teu ano de nascimento para surgir a tua idade. Oresultado deverá aparecer num elemento do HTML (innerHTML)
alert("Minha primeira mensagem!")
exibe uma janela com a frase "Minha primeira mensagem!" com apenas um botão de OK.
AULA 3
Introdução ao JavaScript
O Código JavaScript fica entre as tag <script> e o </script> quando inserido num ficheiro HTML, ou pode ser escrito num ficheiro externo (nome.js)
Expressões condicionantes IF
Expressões condicionantes IF...ELSE
Expressões condicionantes IF...ELSE encadeadas
Expressões selectoras SWITCH
Expressões de Loop FOR
Expressões de Loop WHILE
Exercício 3.1 - Enviar o exercício para o mail do professor: colegio.gpsi@gmail.com
JavaScript: Obter o valor de uma InputBox (ou elemento) e mostrá-lo num window.alert
Exercício 3.2 - Enviar o exercício para o mail do professor: colegio.gpsi@gmail.com
JavaScript: Somar 2 valores introduzidos numa InputBox e mostrar o resultado
AULA 4
JavaScript - Trabalhar com DATAS
Exercício 4.1 - Enviar o exercício para o mail do professor: colegio.gpsi@gmail.com
Mostrar a data e hora actual.
Exercício 4.2 - Enviar o exercício para o mail do professor: colegio.gpsi@gmail.com
Mostrar a seguinte data e hora: "Agosto 15, 1999 10:00:00".
Exercício 4.3 - Enviar o exercício para o mail do professor: colegio.gpsi@gmail.com
Converta, através do método toDateString(), a data actual para um formato mais simples, do tipo: Wed Jan 06 2016
AULA 5
JavaScript STRING MATCH( ) Method
Exercício 5.1 - Enviar o exercício para o mail do professor: colegio.gpsi@gmail.com
Verificar se um texto contém o simbolo "@"
JavaScript SUBSTRING MATCH( ) Method
Exercício 5.2 - Enviar o exercício para o mail do professor: colegio.gpsi@gmail.com
Extrair um conjunto de caracteres, de um determinado texto introduzido, mediante a definição da posição inicial e a posição final.
AULA 6
CSS3 - Responsive Menu
Introdução ao CSS3 - o que é?
EXEMPLO - CSS3 Responsive menu
Exercício 6 - Enviar o exercício para o mail do professor: colegio.gpsi@gmail.com
Implemente um "Responsive menu" com 5 menus no nível de TOPO e cada um com 3 submenus.
AULA 7
Esconder/Mostrar div com JavaScript
EXEMPLO - Esconder/Mostrar div com JavaScript
Exercício 7 - Enviar o exercício para o mail do professor: colegio.gpsi@gmail.com
Construa um layout baseado em DIV's que oculte o mostre a div de topo ou outra de acordo com a estrutura do layout.
O layout tem que estar devidamente preenchido em termos gráficos e deve apresentar o formulário de login.
