HOME

Contatti

MATEMATICA CON JAVASCRIPT


INTRODUZIONE AGLI OGGETTI IN JAVASCRIPT - PAGINA 2
ANALOGAMENTE JAVASCRIPT...

...tratta tutti gli elementi di una pagina web come oggetti che sono disposti ordinatamente secondo una precisa gerarchia.
Non appena avviamo il browser viene visualizzata una finestra: notiamo la barra degli strumenti, la barra dei menu, la barra di stato e così via. Viene visualizzato cioè l'oggetto window, che è al primo posto nella gerarchia degli oggetti, con alcune delle sue proprietà che possiamo definire come suoi elementi:

  • In alto troviamo ad esempio la barra dei menu (menubar), la barra degli strumenti (toolbar);
  • in basso troviamo la barra di stato (statusbar);
  • nella parte centrale troviamo la pagina vera e propria (document)
  • e così via.
Tutti questi elementi sono detti proprietà per l'oggetto window.
Le proprietà sono a volte loro stesse degli oggetti: ad esempio document, che è una proprietà dell'oggetto window è anch'esso un oggetto, infatti a sua volta è il contenitore di altre proprietà (titolo, corpo, colore, eventuali forms e così via).
Ricorrendo ancora una volta all'immagine dell'albero, vediamo che, per JavaScript, "Marcella" corrisponde a
window.document.MioForm.nome.value
In altri termini, JavaScript arriva ad un'oggetto o proprietà seguendo passo per passo il suo albero genealogico, riconoscendo ogni oggetto dal suo nome e separando i successivi oggetti con il punto (.).

Quando si ha a che fare con una sola finestra, e con un solo document, è possibile riferirsi alle varie proprietà semplicemente chiamandole con il loro nome. Ad esempio nel nostro caso, "Marcella" sarebbe raggiungibile anche da

document.MioForm.nome.value

NOTA: MSIE accetta anche: MioForm.nome.value ma, ad esempio, Mozilla no; pertanto si sconsiglia di seguire quest'ultima notazione.

Un'alternativa alla dichiarazione del percorso si può trovare quando si ha a che fare con l'oggetto corrente: è in questo caso possibile usare l'oggetto this (letteralmente:questo).

 

COME AGIRE SUGLI OGGETTI?

Cerchiamo di capire di cosa si tratta aggiungendo un comando Javascript al frammento di codice HTML di inizio pagina 1:

Riepilogo dei dati:
<form name="MioForm">
Nome
<input type="text" name="nome" value= "Marcella" maxlength=15 size=20
OnClick="this.value='Rosetta'" >
Cognome
<input type="text" name="cognome" maxlength=15 size=20
OnClick="window.alert('Stai per immettere il cognome')">
Sesso:
<input type="radio" name="sesso"value="maschio" OnClick="document.MioForm.nome.size=35; document.MioForm.nome.value='hai messo un nome da maschio?'"> Maschio
<input type="radio" name="sesso" value="femmina" checked > Femmina
</form>

Il risultato del codice è il modulo visualizzato qui sotto:

Riepilogo dei dati:
    Nome
Cognome

Sesso: Maschio Femmina

Il modulo appare come quello di pagina 1 ma ci sono dei cambiamenti:
  1. se clicchiamo sulla casella di testo nome "Marcella" si cambia in "Rosetta";
  2. se clicchiamo sulla casella di testo cognome riceviamo l'avviso 'Stai per immettere il cognome'
  3. se scegliamo il sesso maschile, succedono due cose:
    • si amplia la dimensione della casella di testo nome;
    • nella casella viene visualizzato il messaggio "Hai messo un nome da maschio?"
Tutti gli eventi sono attivati dal clic del mouse.

IN EVIDENZA DAL SITO

 



CALCOLATRICE
SCIENTIFICA


CON SPIEGAZIONI
ED ESEMPI

 



TARTAMONDO - PER BAMBINI



AREA GIOCHI

 

 

 

 

 

... tanto altro ancora...


 

Lezione successiva: Oggetto window     

Indice

©2003 - 2012 www.webfract.it