Implementare il codice Javascript

Come già detto, il codice javascript si implementa all'interno delle pagine Html, normalmente all'interno della sezione head, con l'utilizzo dei Tag <script> e </script>.

E' buona norma implementare il codice javascript nell'hreader della pagina perchè il programma sia completamente caricato quando la pagina Html è ancora in fase di caricamento, magari per la presenza di immagini o di elementi multimediali che occupano risorse.

Il Tag <script>

Abbiamo accennato prima al Tag <script>, vediamo in maniera completa come preparare la pagina a ricevere del codice javascript:

<script language="javascript">
 <!--
    ... ... ...
    codice ed istruzioni javascript
    ... ... ...
 //-->
</script>

L'attributo language per specificare il linguaggio di scripting utilizzato, per il javascript è opzionale, dato che è settato come linguaggio di default in tutti i browser, stranamente anche in quelli Microsoft, ma è comunque buona norma includerlo, così come è buona norma utilizzare i commenti per il codice e le istruzioni, per evitare che browser che non supportino javascript interpretino il codice come testo, stampandolo a video.

Un primo esempio di codice

Scriviamo un primo semplice programmino che stamperà a video una stringa, ovvero un testo:

<script language="javascript">
 <!--
    document.write("Ciao a tutti!!!");
 //-->
</script>

Questo, tra l'altro, è un classico esempio di codice che invece non va implementato nell'header della pagina, ma nel punto in cui si vuole appaia la stringa (dato che proprio di una stringa si tratta), ad esempio in una cella di una tabella Html.

Nota: il punto e virgola che viene inserito a fine riga non è obbligatorio in quanto l'interprete javascript riconosce la fine di una riga di codice e lo inserisce automaticamente ècomunque buona norma di programmazione inserirlo.

Il Tag <noscript>

Vediamo come dovremmo comportarci per evitare che un browser che non supporti javascript visualizzi lo stesso questa informazione:

<noscript>
   Ciao a tutti!!!
</noscript>

Il Tag <noscript> si include al di sotto dello script o nel punto della pagina in cui si visualizza la sua esecuzione.

Trattandosi di un semplice testo il problema è così bello e che risolto, ma se si trattasse di un programma complicato e dinamico?

Per un problema simile è il caso di scrivere nel Tag <noscript> qualcosa del tipo: Il tuo browser non supporta javascript, o un qualunque messaggio di avviso del genere che avvisi l'utente che la pagina non sarà visualizzata ne sarà funzionale come dovrebbe per mancanza del supporto di javascript.

La differenzia sostanziale che differenzia <noscript> dagli altri elementi di testo Html è che il testo che contiene compare solo se viene rilevato che il browser non supporta javascript, o per qualunque motivo detta funzione è stato disattivata.

Commentare il codice

E' buona norma di programmazione commentare il codice, ovvero aggiungere porzioni di codice che non verranno interpretate dal browser come comandi javascript, ne verranno stampate a video, ma sono solo esplicative programmatore che può scrivere come promemoria il come e perchè del codice e della tecnica che ha usato per ottenere quel risultato.

I commenti in javascript possono scriversi su di una riga con l'utilizzo dei simboli // o su più righe tra i simboli /* e */.

Vediamo un esempio di commenti su una o su più righe:

//Questo è un commento su una sola riga.

oppure:

/*
   Questo è un commento su più righe.
   Questa è la seconda riga.
   Questa è l'ultima riga.
*/

Includere file esterni Javscript

Molti programmatori ricorrono all'utilizzo di file esterni javascript, file di testo con estensione .js, creabili col blocco note.

Le ragioni sono fondamentalmente due:

1. per discrezione si preferisce non rendere immediata la lettura del proprio codice
2. per rendere più leggibile e chiaro il codice Html della pagina, non appesantendola.

Un file javascript esterno si richiama molto semplicemente:

<script language="javascript" src="mio_file.js"></script>

Utilizziamo l'attributo src per far riferimento al path (percorso) del file all'interno della root (directory principale) del nostro sito. In questo caso il file javascript si trova nella stessa posizione del file che lo richiama.

E' impossibile includere codice tra questi Tag, in quanto rappresentano solo il richiamo al file esterno.

E' possibile includere in una pagina quanti file esterni si vuole, sia nell'header che in un punto della pagina se c'è qualche valore da stampare a video, come nel caso dell'esempio riportato in questa lezione.

Autore: Luca Ruggiero