DOM und #$§§.all.innerHTML

[Hans Thomas Vogler]

ZuneXt mal die Anregung, auch einen Themenbereich "DOM" hier einzurichten, der DHTML ebenso berührt wie Javascript und andere wie HTML überhaupt und auch XML.

Folgendes Problem: ich stelle - überglücklich über die lange überfällige Spezifizierung des Document Object Models - einige Scripts von mir um, die dynamisch Seiten auswerten und in Einzelteile zerlegen, die ich später wieder je nach Ausgabemedium neu sortiere.

Bislang ging das nur im Internet-Explorer durch das "inner-" bzw. "outerHTML" Objekt, das sich in diesem Zusammenhang sehr bequem handhaben läßt, aber keinen Segen des W3C bekommen hat.

Nun stellt im DOM via node-Objekt der innere Code eines Objekts wie z.B. ein <div>&%$<fett>§$</fett>"<klein>$</klein>§</div> eine Zusammenfassung nachgeordneter und unterschiedlicher Elementknoten dar. Ein globales "Inhalt von" gibt es nicht.

Frage: wie bekomme ich nach allgemeingültiger Syntax einen solchen DIV-Container komplett in den Speicher und kann ihn woanders "ausgießen"? Davon, daß im adressierten Layout-Bereich dann "[object]" steht, habe ich herzlich wenig.

Was soll ich tun? Per Schleifen komplett zerstückeln und neu zusammensetzen (= Performance-Verlust :-(o), oder gibt es irgendeinen simplen Trick, den ich übersehen habe und das ganze noch viel viel einfacher macht, als ich mir bislang überhaupt habe vorstellen können?

So, ich hoffe, es findet sich jemand, der mir weiterhelfen kann und meinen schlaflosen Nächten unter der Tastatur ein Ende bereitet.

mfg
HTV

[Thomas Meinike]

Hallo,

Frage: wie bekomme ich nach allgemeingültiger Syntax einen solchen DIV-Container komplett in den Speicher und kann ihn woanders "ausgießen"? Davon, daß im adressierten Layout-Bereich dann "[object]" steht, habe ich herzlich wenig.

Beispiel:

Im BODY liegen ein gefuelltes DIV und ein leerer Absatz:

<div id="block"><b>Text</b></div>
<p></p>

Nun wird eine Funktion aufgerufen, die folgendes macht:

var objekt, klone;
// DIV-Objekt anlegen
objekt=document.getElementById("block");
// Den ersten Knoten klonen
klone=objekt.childNodes.item(0).cloneNode(true);
// den Klone als Kindelement des Absatzes einhaengen
document.getElementsByTagName("p")[0].appendChild(klone);
// den geklonten Knoten entfernen
objekt.childNodes.item(0).removeNode(true);

Danach sieht es im BODY so aus:

<div id="block"></div>
<p><b>Text</b></p>

Im IE kann man sich durch
alert(document.documentElement.outerHTML)
vom Ergebnis ueberzeugen.

Letztlich muss man die gaengigen DOM-Methoden wie getElementById(), getElementsByTagName(), createElement(), appendChild(), removeChild(), replaceChild(), cloneNode(), insertBefore(), createAttribute(), setAttributeNode(), getAttribute(), setAttribute() usw. "geschickt" kombinieren.

MfG, Thomas