Supponiamo di voler aggiungere dei nuovi elementi in una particolare posizione di un documento web, utilizzando uno script Javascript.
Solitamente viene utilizzato un elemento "segnaposto", dotato di un identificativo univoco, che verrà trovato dallo script attraverso il metodo document.getElementById("idUnivoco"). Successivamente i nuovi elementi creati dallo script verranno aggiunti come un sottoalbero del nodo trovato, attraverso il metodo nodoTrovato.appendChild(nuovoNodo).
Vorrei proporre un approccio diverso: uno script è in grado di trovare la propria posizione nell'albero DOM del documento e può aggiungere nuovi elementi immediatamente prima di sè stesso, utilizzando il metodo insertBefore.
Esempio del codice XHTML che contiene lo script Javascript:
<p>Testo di esempio</p> <script type="text/javascript" src="url-script.js"></script> <p>Altro testo di esempio</p>
Contenuto parziale dello script Javascript:
var scripts = document.getElementsByTagName("script");
var lastScript = scripts[scripts.length-1];
var newDiv = document.createElement("div");
lastScript.parentNode.insertBefore(newDiv,lastScript);
Quando viene eseguito lo script si cerca l'ultimo elemento script incontrato fino a quel momento nell'analisi dell'albero DOM del documento.
Il metodo funziona correttamente anche nel caso di una ripetuta occorrenza dello stesso script all'interno del documento.
La descrizione qui