Il linguaggio JavaScript è basato sugli oggetti, cioè una collezione di oggetti è incorporata direttamente nel linguaggio.

Cerchiamo di capire di cosa si tratta partendo da un frammento di codice HTML:

Riepilogo dei dati:
<form name="MioForm">
Nome
 <input type="text" name="nome" value= "Marcella" maxlength=15 size=20>
Cognome
 <input type="text" name="cognome" maxlength=15 size=20>
Sesso:
 <input type="radio" name="sesso" value="maschio"> Maschio
 <input type="radio" name="sesso" value="femmina" checked > Femmina
</form>

• tutti hanno un nome (name) e in particolare:
  • il form ha nome "MioForm";
  • ia prima casella di testo ha nome "nome";
  • la seconda casella di testo ha nome "cognome";
  • i pulsanti radio hanno entrambi nome "sesso";
• le caselle di testo, oltre al nome, hanno anche la dimensione (size) e la massima lunghezza della stringa che può essere inserita (maxlength); la casella di testo "nome" ha il valore (value) Marcella;
• i pulsanti di opzione hanno l'attributo value, in più è stato selezionato (checked) il pulsante "femmina"

L'albero ha in sé il concetto di ordine: esso può essere visitato dalla radice lungo i rami, ma non viceversa.

...tratta tutti gli elementi di una pagina web come oggettui 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.

window.document.MioForm.nome.value

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

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).

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

Riepilogo dei dati:
<form name="MioForm1">
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.status='Stai per immettere il cognome'">
Sesso:
<input type="radio" name="sesso"value="maschio" OnClick="document.MioForm1.nome.size=35; document.MioForm1.nome.value='hai messo un nome da maschio?'"> Maschio
<input type="radio" name="sesso" value="femmina" checked > Femmina
</form>

[Avrete notato che il nome del form è cambiato: questo è perché, nella stessa pagina, ogni form deve avere un nome univoco]

Il risultato del codice è il modulo visualizzato qui sotto:

Riepilogo dei dati: Nome Cognome Sesso: Maschio Femmina

Il modulo appare come quello di inizio pagina ma ci sono dei cambiamenti : se clicchiamo sulla casella di testo nome "Marcella" si cambia in "Rosetta"; se clicchiamo sulla casella di testo cognome compare un messaggio nella barra di stato 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.