|
|
|
|
|
|
|
| << | < | > | >> |Indice
INTRODUZIONE XVII
1 Introduzione a JavaScript 1
Che cosa è necessario sapere 2
Elementi di base del linguaggio HTML 2
Che cosa sono gli editor di testi e i browser Web 3
Quale versione? 6
Attenzione, JavaScript non è Java 7
Analogie con altri linguaggi 7
Introduzione a JavaScript 7
Linguaggio a oggetti 8
Linguaggio per il lato client 8
Linguaggio script 9
Conclusioni 9
Risorse online 10
Progetto 1-1 Usare JavaScript per scrivere del testo 11
Passo dopo passo 11
Conclusioni del progetto 11
Modulo 1 - Verifica 12
2 Inserimento di codice JavaScript in un file HTML 15
Uso dei tag HTML SCRIPT 16
Identificazione del linguaggio script 16
Chiamata di script esterni 17
Nascondere il codice JavaScript per i browser
meno recenti 18
Creazione del primo script 19
Realizzazione di uno script "Hello World" 19
Creazione di un documento HTML per lo script 20
Inserimento dello script in un documento HTML 20
Progetto 2-1 Inserimento di uno script in un
documento HTML 22
Passo dopo passo 22
Conclusioni del progetto 23
Uso di file JavaScript esterni 23
Creazione di un file JavaScript 24
Creazione dei file HTML 24
Visualizzazione delle pagine nel browser 26
Progetto 2-2 Chiamata di uno script esterno
da un documento HTML 27
[...]
Uso dei commenti JavaScript 28
Inserimento di commenti su una riga 28
Aggiunta di commenti su più righe 29
Modulo 2 - Verifica 30
3 Uso delle variabili 33
Che cosa sono le variabili 34
A che cosa servono le variabili 34
Risparmio di tempo 35
Le variabili chiariscono il significato
del codice 35
Definizione delle variabili per gli script 36
Dichiarazione di variabili 36
Come assegnare un valore a una variabile 37
Denominazione delle variabili 38
I vari tipi di variabili 41
Numeri 41
Stringhe 42
Valori booleani 47
Valori nulli 48
Progetto 3-1 Dichiarazione di variabili 49
[...]
Uso delle variabili negli script 50
Come richiamare una variabile 50
Come aggiungere variabili a una stringa di testo 51
Realizzazione di una pagina in JavaScript 53
Creazione di una struttura di base 53
Definizione delle variabili 53
Aggiunta dei comandi 54
Modifica della pagina 55
Progetto 3-2 Creazione di una pagina HTML
con JavaScript 57
Modulo 3 - Verifica 60
4 Uso delle funzioni 63
Che cos'è una funzione 64
A che cosa servono le funzioni 64
La struttura delle funzioni 65
Dichiarazione delle funzioni , 65
Definizione del codice delle funzioni 66
Denominazione delle funzioni 67
Utilizzo dei parametri nelle funzioni 69
Aggiunta di istruzioni return a una funzione 71
Chiamata delle funzioni da uno script 72
Chiamata di una funzione nella sezione HEAD 73
Chiamata di una funzione nella sezione BODY 76
Richiamare una funzione da un'altra funzione 78
Chiamate di funzioni con parametri 80
Uso delle istruzioni return nelle funzioni 84
Progetto 4-1 Creazione di una pagina HTML
contenente funzioni 86
Conclusioni 87
Progetto 4-2 Scrivere nuove funzioni 89
Modulo 4 - Verifica 90
5 Gli operatori JavaScript 93
I vari tipi di operatori 94
Gli operatori matematici 95
[...]
Gli operatori di assegnamento 104
[...]
Progetto 5-1 Modificare il valore di una variabile 107
Gli operatori di confronto 109
[...]
Gli operatori logici 114
[...]
Operatori speciali 117
L'ordine delle operazioni 118
Progetto 5-2 Vero o falso? 120
Modulo 5 - Verifica 121
6 Istruzioni condizionali e cicli 123
Le istruzioni condizionali 124
Perché sono così utili le istruzioni
condizionali 124
Uso delle istruzioni condizionali 125
Uso dei blocchi if/else 126
Uso dell'istruzione switch 134
Progetto 6-1 Realizzazione di un blocco if/else 137
I cicli 138
Che cos'è un ciclo? 138
Perché sono utili i cicli 138
Uso dei cicli 139
I cicli for 140
I cicli while 147
Il ciclo do while 149
Progetto 6-2 Uso dei cicli for e while 150
Modulo 6 - Verifica 151
7 I gestori di eventi 155
Che cos'è un gestore di eventi? 156
Perché i gestori di eventi sono così utili 156
Posizionamento e utilizzo dei gestori di eventi 157
Posizionamento dei gestori di eventi 157
Uso dei gestori di eventi 157
Progetto 7-1 Creazione di un pulsante 160
Che cosa sono i gestori di eventi 161
[...]
Progetto 7-2 Invio di messaggi d'allarme
tramite eventi 172
Altri eventi 173
[...]
Creazione di script utilizzando i gestori di eventi 176
Il contenuto della barra di stato 176
Un collegamento ipertestuale su un pulsante 178
Progetto 7-3 Uso delle proprietà status e location
della finestra 180
Modulo 7 - Verifica 181
8 Gli oggetti 185
Gli oggetti 186
Che cos'è un oggetto? 186
Perché sono utili gli oggetti 187
Creazione di nuovi oggetti 188
Denominazione 188
La struttura degli oggetti 188
Aggiunta di metodi 198
Istruzioni per la manipolazione degli oggetti 202
Progetto 8-1 Creare un oggetto 205
Gli oggetti predefiniti di JavaScript 207
L'oggetto navigator 207
Progetto 8-2 Utilizzo dell'oggetto predefinito
navigator 214
Modulo 8 - Verifica 214
9 L'oggetto document 217
Che cos'è l'oggetto document 218
Uso delle proprietà dell'oggetto document 219
[...]
Uso dei metodi dell'oggetto document 250
[...]
10 L'oggetto window 259
Introduzione all'oggetto window 260
Uso delle proprietà dell'oggetto window 261
[...]
Uso dei metodi dell'oggetto window 269
[...]
11 Gli array in JavaScript 299
Che cos'è un array 300
Perché sono utili gli array 301
Definizione e accesso a un array 302
Denominazione 302
Definizione di un array 302
Accesso agli elementi di un array 303
Altri modi per definire un array 304
Le proprietà e i metodi dell'oggetto Array 307
Le proprietà 307
Metodi 310
Uso dei cicli sugli array 319
Creazione degli elementi di un array 319
Spostamenti all'interno degli array 321
Progetto 11-1 Cicli e array 325
Uso degli array associativi 326
Che cosa sono gli array associativi 326
Accesso agli array associativi 327
Progetto 11-2 Uso degli array associativi 328
Modulo 11 - Verifica 329
12 Gli oggetti Math, Number e Date 333
Uso dell'oggetto Math 334
Che cos'è l'oggetto Math? 334
In quale modo può essere utile l'oggetto Math 334
Proprietà 335
Metodi 338
Progetto 12-1 Visualizzazione di un collegamento
ipertestuale casuale 352
L'oggetto Number 352
Proprietà 353
Metodi 355
Uso dell'oggetto Date 356
Proprietà 356
I metodi 357
Metodi che restituiscono valori 358
Metodi che impostano valori 361
Altri metodi 362
Progetto 12-2 Creazione di un orologio JavaScript 366
Modulo 12 - Verifica 367
13 Manipolazione delle stringhe 369
Introduzione all'oggetto String 370
L'oggetto String 370
I letterali stringa 370
Qual è la differenza? 371
Uso delle proprietà dell' oggetto String 372
[...]
Uso dei metodi dell'oggetto String 375
[...]
Progetto 13-1 Uso di charAt() per trovare
la prima lettera 393
Conclusioni 394
Progetto 13-2 Uso di indexOf() per controllare
un indirizzo 396
Modulo 13 - Verifica 397
14 JavaScript e i moduli (form) 399
Accesso ai moduli 400
Uso di un array di form 400
Uso del nome dei form 404
Uso delle proprietà e dei metodi
dell'oggetto form 406
Le proprietà dell'oggetto form 406
I metodi dell'oggetto form 419
Convalida 420
onSubmit e l'istruzione return 420
Tecniche 422
Progetto 14-1 Che ore sono? 425
Uso dei form per attività di navigazione 425
Navigazione con caselle di selezione 426
Pulsanti di navigazione 429
Progetto 14-2 Script di navigazione
a caselle di selezione 430
Modulo 14 - Verifica 431
15 JavaScript e i frame 433
Un'introduzione ai frame 434
Lo scopo dei frame 434
Il codice contenente i frame 435
Opzioni per l'utilizzo dei frame 437
Accesso ai frame 440
L'array frames 441
Denominazione dei frame 444
Cambiare il contenuto di un frame 446
Cambiare il contenuto di un unico frame 446
Cambiare il contenuto di più frame 448
Progetto 15-1 Cambiare i frame 450
Navigazione nei frame 452
Uso di una casella di selezione nei frame 452
Problemi con i frame 454
Rinviare gli utenti alla pagina a frame 456
L'uso delle variabili su più frame 458
Progetto 15-2 Uso delle variabili 462
Modulo 15 - Verifica 464
16 Tecniche avanzate di programmazione JavaScript 467
Debugging degli script 468
I vari tipi di errori 468
Uso delle espressioni regolari 474
Creazione di espressioni regolari 475
Confronto fra stringhe ed espressioni regolari 475
Aggiunta di flag 477
Creazione di schemi più potenti 477
Sostituzione di parti di una stringa 482
Progetto 16-1 Convalida di un indirizzo Web 484
Uso dei cookie 485
Impostazione di un cookie 486
Lettura di un cookie 488
Progetto 16-2 Memorizzazione di un nome 491
Utilizzo delle immagini 492
Precaricamento 492
I rollover 494
Progetto 16-3 Creazione di un sistema
di navigazione a immagini 507
La sicurezza in JavaScript 507
Sicurezza e script firmati 508
Protezione della pagina 508
Modulo 16 - Verifica 510
Indice analitico 513
|
| << | < | > | >> |Pagina 2Questa è la seconda edizione del volume Fondamenti di JavaScript. Il lettore è evidentemente interessato all'apprendimento di JavaScript ma forse non sa ancora di cosa ha bisogno per iniziare a utilizzarlo. Questo modulo risponde ad alcune domande di base, spiegando che cos'è JavaScript, descrivendo i suoi vantaggi e i suoi limiti, spiegando come si può utilizzare JavaScript per creare pagine Web più dinamiche e interessanti e fornendo un breve riepilogo cronologico del linguaggio. Ormai JavaScript è impiegato ovunque nel World Wide Web. Si può utilizzare JavaScript sia per creare pagine Web interattive (in grado di reagire alle azioni dei visitatori) sia per inserire nelle pagine Web alcuni effetti speciali (visuali o di altro tipo). JavaScript viene spesso affiancato ad HTML (Hypertext Markup Language) quale linguaggio consigliato per coloro che intendono iniziare a sviluppare pagine Web (per professione o per diletto). Naturalmente si possono realizzare pagine Web utilizzando solo HTML, ma JavaScript consente di aggiungere nuove funzionalità che sarebbe impossibile ottenere in una pagina statica realizzata solo con HTML. 1.1 Che cosa è necessario sapere Prima di iniziare a parlare di JavaScript, occorre introdurre alcune informazioni di base sui seguenti argomenti. * Il linguaggio HTML * Gli editor di testo * I browser Web * Le varie versioni del linguaggio JavaScript Se, come è probabile, il lettore è già dotato di alcune di queste conoscenze di base, non vi saranno problemi a procedere nella lettura di questo volume. In particolare non è richiesta alcuna conoscenza di altri linguaggi di programmazione o di linguaggi per script, né una precedente esperienza con JavaScript. In fin dei conti questo volume descrive proprio i Fondamenti di JavaScript. Se si pensa di non avere sufficiente esperienza in uno dei campi appena menzionati, i seguenti paragrafi potranno essere utili per procedere nella lettura del volume. Elementi di base del linguaggio HTML Non è certo necessario essere grandi esperti di HTML, ma occorre quanto meno sapere dove posizionare determinati elementi (per esempio gli elementi che compongono il titolo e il corpo delle pagine) e come aggiungere gli attributi necessari. Questo volume fa spesso riferimento all'inserimento di script nella sezione HEAD (compresa fra i tag <HEAD> e </HEAD> e nella sezione BODY (compresa fra i tag <BODY> e </BODY» di una pagina Web. Talvolta, perché uno script possa funzionare correttamente, sarà anche necessario aggiungere un attributo a un tag. Per esempio, può essere necessario assegnare un nome a un elemento utilizzando l'attributo name, come nel seguente esempio: <INPUT type="text" name="nome">" Se si conoscono gli elementi di base dell'utilizzo dei tag e degli attributi, il linguaggio HTML non dovrebbe rappresentare un problema per l'apprendimento di JavaScript. Un utile testo di riferimento sull'argomento è HTML la Reference di T.A. POWELL (McGraw-Hill,2001). Che cosa sono gli editor di testi e i browser Web Prima di iniziare a programmare con JavaScript, occorre essere in grado di utilizzare un editor di testi o un editor HTML più un browser Web. Questi saranno gli strumenti da utilizzare per realizzare gli script. Editor di testi Sono moltissimi gli editor di testi e gli editor HTML che supportano JavaScript. Chiunque abbia provato a realizzare una pagina Web con il linguaggio HTML, avrà probabilmente già utilizzato un editor HTML e dunque non sarà necessario cambiare nulla. Tuttavia alcuni editor HTML non consentono l'aggiunta di codice JavaScript (per esempio non consentono di cambiare la posizione del codice o di modificare il codice una volta che il file è stato salvato). In questo caso si dovrà utilizzare un editor più semplice oppure trovare un editor HTML in grado di gestire con maggiore facilità l'aggiunta di codice JavaScript. Per esempio si può utilizzare il Blocco note di Windows, TextPad o Simple Text. I browser Web Anche in questo caso, se si ha già qualche esperienza di programmazione con il linguaggio HTML, probabilmente non sarà necessario cambiare browser. Tuttavia alcuni browser non sono in grado di gestire le versioni più recenti di JavaScript. Il lettore può scegliere il browser Web che preferisce; è sufficiente che tale browser sia compatibile con JavaScript. Per collaudare il codice JavaScript si consiglia di impiegare uno dei seguenti browser. * Microsoft Internet Explorer versione 4.0 o successiva. * Netscape Navigator versione 4.0 o successiva. Con l'andar del tempo vengono continuamente sviluppate nuove versioni di questi browser. Al momento attuale, Microsoft Internet Explorer è giunto alla versione 6 e Netscape Navigator alla versione 7. | << | < | > | >> |Pagina 71.4 Introduzione a JavaScriptL'origine di JavaScript è dovuta a uno sforzo congiunto di Netscape Communications Corporation e Sun Microsystems. La prima release del nuovo linguaggio risale al 4 dicembre 1995, quando Netscape Navigator 2.0 era ancora in versione "beta" (per informazioni sulle release consultare l'indirizzo http://home.netscape.com/newsref/pr/newsrelease67.html). JavaScript versione 1.0 è stato reso disponibile con il lancio di questo nuovo browser (prima del suo rilascio con il nome "JavaScript", il linguaggio si chiamava LiveScript). JavaScript è un linguaggio a oggetti per il lato client, utilizzabile per rendere dinamiche le pagine Web. Per dare un senso a questa definizione, i prossimi paragrafi esamineranno le sue parti una per una. Linguaggio a oggetti Un linguaggio a oggetti come JavaScript può utilizzare elementi chiamati oggetti. Tuttavia gli oggetti non sono basati su classi (ovvero non esiste alcuna distinzione fra una classe e un'istanza); al contrario sono semplicemente oggetti generali. Si imparerà a utilizzare gli oggetti JavaScript nel Modulo 8. Non si avrà bisogno di parlare in dettaglio degli oggetti finché non saranno state introdotte alcune caratteristiche di base del linguaggio. Linguaggio per il lato client Questo significa che JavaScript viene eseguito nel software client utilizzato da colui che visualizza la pagina Web e non dal server Web del sito che sta inviando la pagina. In questo caso, il client sarà un browser Web. Per chiarire meglio questo fatto, si parlerà del funzionamento dei linguaggi per il lato server e dei linguaggi per il lato client. Linguaggi per il lato server Un programma scritto in un linguaggio per il lato server prevede che la pagina Web o il browser Web, inviino delle informazioni a un programma in esecuzione sul computer server, il quale poi rinvia le informazioni di nuovo al browser. Pertanto è necessario un passo intermedio (invio e ricezione delle informazioni dal server) prima che il browser possa presentare i risultati. Un linguaggio per il lato server dà al programmatore varie possibilità che non possono essere presenti su un linguaggio per il lato client, per esempio il salvataggio delle informazioni sul server Web o l'utilizzo di nuove informazioni per aggiornare una pagina Web e salvare gli aggiornamenti. Tuttavia un linguaggio per il lato server ha funzionalità limitate nel campo della gestione di quelle funzionalità della finestra del browser che possono essere manipolate con il linguaggio sul lato client (come il contenuto presentato nella barra di stato del browser o il contenuto di un modulo, prima che venga inviato al server). Linguaggi per il lato client Un programma scritto in un linguaggio per il lato client viene eseguito direttamente nel client utilizzato da colui che visualizza la pagina. Nel caso di JavaScript, il client è un browser Web. Pertanto il codice JavaScript viene eseguito direttamente nel browser Web e non deve svolgere le operazioni di invio e ricezione delle informazioni dal server. Con un linguaggio per il lato client, il browser legge e interpreta il codice e i risultati possono essere presentati all'utente che visualizza la pagina senza richiedere alcuna infonnazione al server. Questa possibilità consente di eseguire più rapidamente alcune operazioni. Un linguaggio per il lato client può anche accedere ad alcune funzionalità speciali della finestra del browser che potrebbero non essere accessibili con un linguaggio per il lato server. Tuttavia a un linguaggio per il lato client manca la possibilità di salvare i file o gli aggiornamenti su un server Web, mentre questa funzionalità è presente in un linguaggio per il lato server. Un linguaggio per il lato client è particolarmente utile per operazioni che riguardano le parti del browser che prevedono la convalida delle informazioni che devono essere inviate a un programma o a uno script operante sul lato server. Per esempio, JavaScript può aprire una nuova finestra di dimensioni ben determinate, con determinate caratteristiche (per esempio una barra degli strumenti o una barra di stato) e una determinata posizione sullo schermo. JavaScript può essere utilizzato anche per verificare le informazioni inserite in un modulo prima di inviarle a un programma sul lato server per l'elaborazione. Questo controllo delle informazioni semplifica il compito del server Web, impedendo che vengano inviate infonnazioni imprecise o incomplete. Invece di ripetere l'esecuzione del programma sul server finché le informazioni non saranno corrette, i dati possono essere inviati al server una sola volta, dopo essere stati verificati da un programma sul lato client. Linguaggio script Un linguaggio script può essere eseguito senza compilazione. In pratica viene interpretato "al volo" dal client. Con un normale linguaggio di programmazione, prima di poter eseguire un programma occorre scriverlo, ed elaborarlo con un particolare programma chiamato compilatore che verifica che il programma non contenga errori di sintassi. Con un linguaggio script, il codice viene interpretato nel momento in cui viene caricato nel client. Pertanto è possibile verificare i risultati del codice molto più rapidamente. Tuttavia gli errori non verranno individuati prima dell'esecuzione dello script e dunque possono provocare dei problemi nel caso in cui il client non sia in grado di gestire correttamente tali errori. Nel caso di JavaScript, la gestione degli errori è lasciata al browser impiegato per visualizzare la pagina Web. Conclusioni Dopo questa presentazione, ci si potrebbe chiedere in quale modo JavaScript possa essere eseguito in un browser, dove si deve scrivere il codice JavaScript e in quale modo il browser riesce a capire che si tratta di un elemento differente rispetto al resto della pagina Web. Per il momento le risposte possono essere generali, ma il prossimo modulo fornirà ulteriori dettagli. JavaScript può essere eseguito nel browser aggiungendo particolari elementi a un documento HTML esistente. In particolare si deve inserire nel codice HTML un insieme di tag e comandi speciali che dicono al browser che in quella posizione deve essere eseguito uno script. Quando il browser individua questi speciali tag, interpreta i comandi JavaScript ed esegue le azioni specificate all'interno del codice. Pertanto, per utilizzare JavaScript nelle pagine Web e vedere i risultati basta aprire e modificare un documento HTML. Per esempio nel seguente listato viene aggiunto del codice JavaScript a un file HTML che scrive del testo nella pagina Web. Si noti l'aggiunta dei tag <SCRIPT> e </SCRIPT> Il testo racchiuso fra questi tag è codice JavaScript.
<HTML>
<BODY> Questo tag dice al browser che ciò
<SCRIPT language="JavaScript"> --- che segue è codice JavaScript
document.write ("Scrive del testo sulla pagina"); --- Questa riga scrive
</SCRIPT> --- Questa riga segnala sulla pagina il testo
</BODY> la fine dello script racchiuso fra apici
</HTML>
Il prossimo modulo spiega come aggiungere del codice JavaScript a un file
HTML utilizzando i tag HTML <SCRIPT> e </SCRIPT>. Questo è il primo
passo
per
diventare un provetto programmatore JavaScript.
|
