JavaScript (dalle pagine statiche alle pagine dinamiche)
|
- Argomento della lezione
- Materiale scaricabile
- Esempi visti a lezione
- Esercizi da svolgere
- Glossario
- Link
|
Argomento della lezione
Agli inizi del Web (poco più di 10 anni fa), tutta l'informazione inviata in risposta ad
una richiesta da parte di un utente era statica:
l'informazione fornita al client A era la stessa fornita al
client B perchè i server web si limitavano a restituire documenti
HTML statici, magari corredati di immagini GIF o JPEG (il formato PNG è più recente).
Non esisteva quindi una vera e propria interazione tra l'utente finale e il
server: il primo (mediante il suo browser) faceva una richiesta,
il secondo spediva indietro un documento HTML.
Anche quando le pagine HTML hanno cominciato ad essere più complesse, includendo grafica,
animazione, suoni, ... l'interazione era ancora inesistente, basandosi solo su quanto
fornito dai collegamenti ipertestuali.
Per ovviare a questa mancanza di interazione sono state introdotte delle
estensioni che vengono spesso classificate con i nomi di programmazione
server side (che vedremo più avanti) e programmazione client side,
quest'ultima resa possibile dall'introduzione del linguaggio JavaScript (e da altri
linguaggi simili, per esempio JScript della Microsoft).
Grazie alla programmazione client side l'utente (tramite il suo browser) diventa
parte attiva nell'interazione.
Mediante il browser, infatti, può cambiare dinamicamente
l'aspetto della pagina HTML corrente, aprire nuove finestre, far eseguire
al browser semplici operazioni matematiche.
Inoltre, sempre grazie all'introduzione di JavaScript, diventa possibile validare
i dati forniti in input dall'utente, prima ancora di inviarli al server
per le elaborazioni successive.
La programmazione client side scarica il server di una parte del lavoro perchè i programmi,
distributi tramite la rete, vengono eseguiti (interpretati) direttamente sull'elaboratore client.
Uno dei principali problemi di questa tecnica di programmazione è dovuto al fatto che
il codice deve essere scritto per funzionare su browser di tipo diverso
(e non sempre è facile scrivere codice compatibile per ogni browser).
Inoltre, con il semplice uso della programmazione client side non è possibile accedere
ai dati memorizzati in database remoti, nè salvare lo stato della computazione.
Per motivi di sicurezza, infine, i programmi client side non possono scrivere file
sull'elaboratore client (tranne nel caso del file del cookies): questo per evitare che
programmi maliziosi possano riempire i file system in giro per il mondo.
NB naturalmente l'utente può sempre disabilitare l'interpretazione di
JavaScript sul suo browser rendendo vani tutti i nostri sforzi ....
|
|
Materiale scaricabile
- Lucidi della lezione
- in formato PDF, 3 diapositive per pagina, con spazio
per le note (circa 90 KB)
- in formato PDF, 6 diapositive per pagina (circa 80 KB)
- Appunti sul core-language (per favore segnalatemi eventuali errori)
- Nota sul metodo window.prompt()
|
Esempi visti a lezione (guardate sempre il sorgente HTML+JavaScript)
NB ogni esempio che trovate qui sotto costituisce una possibile soluzione
ad un problema, non deve essere considerato come l'unica soluzione.
Esistono sicuramente modi migliori di scrivere lo stesso codice ...
*** verificate se con Mozilla per Linux le finestre di dialogo che si
aprono con i metodi alert(), prompt(), confirm() sono modali oppure no.
- Esempio 1
- Esempio 2
- Esempio 3
- Esempio 4
- Esempio 5
|
Esercizi
- Scrivete una pagina HTML con uno script JavaScript che chiede
in input all'utente dei dati fino a quando questi non digita un carattere particolare
(ad esempio *). L'input deve essere inserito in una variabile msg e visualizzato
al termine dell'esecuzione dello script. Se l'utente preme il pulsante Cancel, si deve
uscire dallo script senza produrre alcun output.
- Scrivete una pagina HTML con uno script JavaScript che chiede all'utente di
scegliere un livello di diffcoltà (per esempio basso, medio,
alto). A seconda del livello di difficoltà prescelto, si navigherà verso una pagina
HTML diversa ma, poichè per ora non lo sappiamo ancora fare, proponete in output una
domanda consistente con il livello di difficoltà prescelto.
Versione più complessa dell'esercizio
Proponete all'utente una domanda a risposta chiusa usando il metodo window.prompt(),
salvate la sua risposta e verificate se è corretta.
|
Glossario
Le definizioni che seguono sono prese dal sito web
http://www.webopedia.com
- ECMA
- JavaScript
- JScript
- DOM
- interprete
- evento
Link
- JavaScript Central
- The JavaScript Source
- W3C Document Object Model
- Alcuni esempi (in italiano)
|
Libro consigliato per questa parte
David Flanagan, JavaScript: la guida, Apogeo
(ma qualunque altro testo va bene)
|
|
|