Il titolo può trarre in inganno, infatti in questa guida non imparerete a scrivere il vostro programma hello world, ma vi cimenterete con le tecniche di base di Ajax; di cui vi avevo già parlato nel mio blog.

Se non avete ancora letto l'intervento sul blog vi consiglio di farlo eccovi il link: Ajax.

Allora iniziamo subito con un pò di codice.

<script> 
function script1() { 
   var e = document.getElementById("pluto"); 
   e.innerHTML = "Benone!"; } 
</script> 
<div id="pluto"> 
Ciao come stai? 
</div> 
<input type="button" value="Esegui esempio" onClick="script1()" />

Provate a guardare il codice dell'esempio; alla pressione del bottone il contenuto dell'elemento DIV che ha come id pluto viene modificato da "Come stai" a "Benone!". Guardando il codice si capisce subito che farlo è molto semplice, questa è la funzione script1 che viene richiamata alla pressione del pulsante:

function script1() {
   var e = document.getElementById("pluto");
   e.innerHTML = "Benone!";
}

La funzione script1 chiama la funzione document.getElementById passando come argomento l'id del DIV, e quello che viene ritornato è un riferimento all'oggetto che rappresenta il nostro DIV nella pagina HTML. L'oggetto ha la proprietà chiamata innerHTML che può essere letta o scritta. Se viene letta restituisce il codice HTML presente dentro il DIV, se viene scrittta il contenuto del DIV cambia e gli effetti si vedono immediatamente nella pagina.

Provate anche voi!