JavaScript

O JavaScript é uma linguagem de programação poderosa e muito utilizada que funciona nos navegadores web. Pode ser usada de modo a criar código para qualquer coisa, desde uma simples animação até um jogo vídeo completo.

No livro, adicionámos à nossa página web um script simples para troca de imagens, incorporando-o no código HTML da página. No entanto, se quiséssemos poderíamos ter posto o script num ficheiro separado. Isso é útil quando queremos que o mesmo script funcione em várias páginas – assim não precisamos de o acrescentar a cada página. Usar scripts em ficheiros separados também torna mais curto o código das páginas web, tornando mais rápido o seu carregamento.

Corta o código JavaScript do código HTML da tua página e cola-o num novo ficheiro de texto vazio – só precisas de cortar as partes em JavaScript que estão entre as etiquetas <script>, e não as próprias etiquetas, ou seja, só precisas de copiar código como o que vês abaixo:


function trocarImagem() {
  var imagemMostrada = document.getElementById('imagem-mostrada');
  if (imagemMostrada.src.match("imagens/01.png")) {
    imagmeMostrada.src = "imagens/02.png";
  }
  else {
    imagemMostrada.src = "imagens/01.png";
  }
}

Guarda o novo ficheiro JavaScript dando-lhe um nome apropriado e a extensão .js – por exemplo, trocador.js.

A tua página HTML contém agora um elemento vazio, <script></script>, do qual cortaste o código JavaScript. Agora precisas de dizer ao navegador que queres adicionar um script externo e onde encontrá-lo. Para isso usa os atributos type e src:

<script type="text/javascript" src="trocador.js"> </script>

O atributo type="text/javascript" diz ao navegador que estás a usar JavaScript – esta parte é sempre assim. O atributo src="trocador.js" diz-lhe que o script se chama trocador.js e que está na mesma pasta que a página web.

Se quiseres guardar o ficheiro .js noutro local, terás de inserir no atributo o caminho do ficheiro. Por exemplo, se criaste uma subpasta chamada scripts para guardares os teus scripts, o atributo deverá ser src="scripts/trocador.js".

Podes encontrar na web muito mais informação (quase sempre em inglês) sobre como programar em Javascript: