W3 - progettazione e realizzazione di ipertesti per siti Web

11. JavaScript

In questo capitolo si introduce il linguaggio JavaScript limitatamente agli aspetti fondamentali. Un riferimento completo a tale linguaggio di script è reperibile al seguente indirizzo: http://developer.netscape.com/tech/javascript/index.html .

Che cosa è JavaScript

La prima cosa da precisare è che JavaScript e JScript non sono la stessa cosa. JavaScript è stato sviluppato dalla Netscape Communications Corporation ed è riconosciuto dalla maggior parte dei browser, mentre JScript è la versione Microsoft di JavaScript ed è riconosciuto in tutte le sue finzioni soltanto da Internet Explorer.

JavaScript ha solamente alcune caratteristiche di un linguaggi di programmazione, come Java o C++, in quanto è un linguaggio di script.

Le cose che JavaScript non può fare

In quattro aree JavaScript non è efficiente, tutte queste aree riguardano la protezione dei dati dei personal computer o l'ambiente dei browser:

JavaScript non ha alcuna capacità grafica;
non può scrivere né leggere i file sulla macchina client;
opera in rete soltanto per scaricare i contenuti delle pagine Web;
non ha capacità di multithreading.

Le cose che JavaScript può fare

JavaScript è un linguaggio di programmazione orientato agli oggetti che è stato appositamente ideato come interfaccia con HTML. Le cose più comuni che JavaScript può fare sono:

controllare le funzioni del browser;
modificare l'aspetto delle pagine Web, sfondo, caratteri,...;
manipolare le immagini;
registrare e usare le informazioni sugli utenti.

Come creare un JavaScript

Le parti di codice JavaScript devono essere all'interno del tag <script> ... </script>.

<script> ... </script>.

Il tag <script> ... </script> contiene tutto il codice JavaScript(o di un altro linguaggio) di un documento HTML. Qualsiasi script deve essere specificato all'interno di questo tag, altrimenti il browser non sarà in grado di riconoscere gli script e li visualizzerà come semplici testi. Gli attributi che possono essere specificati per tale tag sono: charset, defer, language, src, type. Analizziamo i singoli attributi:

Attributo	Funzione
src	viene utilizzato per specificare l'URL di uno degli script esterno nello stesso modo in cui vengono definiti i link con le immagini. Es: <script scr="script.js">
type	dovrebbe sempre essere utilizzato. Specifica il linguaggio di programmazione utilizzato per lo script in esame. Alcuni possibili valori sono: "text/javascript", "text/tcl", "text/vbscript". Il W3C consiglia di utilizzare sempre questo attributo e di non fare affidamento sulle impostazioni standard dei browser.
defer	indica al browser se il codice dello script è necessario per costruire la pagina. Se utilizzate il valore defer="true", il browser non dovrà attendere l'esecuzione dello script per creare la pagina Web.
language	nelle versioni HTML precedenti alla 4.0 era utilizzato al posto di type. Dalla versione 4.0 in poi si deve utilizzare l'attributo type.

Lo script di seguito riportato permette di visualizzare la frase "Hello world".

Codice HTML	Resa del browser
<script type="text/JavaScript"> //Creiamo una variabile con il testo da stampare. var Frase = "<center><h3>Hello World!</h3></center>" //Stampiamo il testo. document.writeln(Frase) </script>

Alcuni JavaScript di uso comune

Creare finestre di pop-up

Una caratteristica molto utile di JavaScript è la possibilità di aprire finestre nuove. Diversamente dai frame, le nuove finestre sono per l'utente delle entità distinte con le quali possono interagire. Le nuove finestre sono controllate dall'autore del documento HTML. L'autore del documento può definire le seguenti caratteristiche della nuova finestra:

le dimensioni, height e width
barra dei menù, barra di stato e barre di scorrimento
contenuti

L'istruzione che permette di aprire una nuova finestra è la seguente:

Codice HTML	Resa del browser
<a href="cap9_Javascript.html" onclick="window.open('11-Javascript.html','prova','height=400,width=500,scrollbars')"> Prova di pop-up </a>	Prova di pop-up

La chiamata al metodo onclick può essere sostituita con altri metodi modificando l'effetto rendendolo più gradevole. I principali metodi applicabili sono: onMuoseOver, OnMouseOut. Tutte i metodi che possono essere chiamati sono descritti nelle specifiche dell'HTML 4.01, reperibile all'indirizzo: http://www.w3c.org

Visualizzare la data dell'ultima modifica del file.

Una funzione molto interessante e molto utile è visualizzare all'interno di tutte le pagine(o solo per alcune) di un sito Web la data dell'ultima modifica dei file. Questo è molto importate per l'utente in quanto riesce a capire se le informazioni sono aggiornate o sono obsolete. Vediamo il codice Javascript per poter visualizzare la data dell'ultima modifica del file.

Codice HTML	Resa del browser
<script type="text/JavaScript"> document.write(document.lastModified) </script>

Naturalmente la data viene rappresentata nel formato internazionale in modo che sia leggibile da tutti. L'ora ha il formato delle 12 ore con l'indicatore AM/PM (AM=Ante Meridiem o mattino; PM= Post Meridiem o pomeriggio).

Esercizi

1. Quali sono i tag e i loro attributi necessari per creare una JavaScript?

2. Perché non è buona norma usare JScript?

3. Tutti i browser supportano JavaScript?

Fogli di stile

Indice

Valid HTML 4.01!