Supponiamo di voler creare una tabella con una riga e due celle fatta in questo modo (per il momento non ci occupiamo del contenuto delle celle, che rimangono vuote):
La figura seguente mostra la struttura ad albero corrispondente al nodo table e ai suoi discendenti:
Per creare una struttura di questo tipo possiamo fare così:
Si noti come le celle siano state create vuote. Per riempirle, occorre aggiungere alla struttura nodi testuali (vedi sotto).
Molti elementi (per esempio i paragrafi, le intestazioni, le celle di una tabella etc.) non sono completi senza un contenuto testuale.
Per esempio, creando un nuovo paragrafo in questo modo:
esso viene creato vuoto, senza contenuto (<p></p>).
Per aggiungere contenuto testuale a un nodo contenitore (come il paragrafo) occorre creare un nodo di tipo testo, figlio del nodo contenitore. Infatti, come abbiamo già osservato parlando della struttura del DOM, i testi sono considerati a tutti gli effetti dei nodi.
Dunque la sequenza di operazioni necessarie è la seguente:
Naturalmente il nodo paragrafo e il nodo di testo così creato devono infine essere appesi al DOM (con il metodo appendChild o insertBefore).
Sito realizzato in base al template offerto da
http://www.graphixmania.it