HTML-Element gegen XML-Node austauschen
Andreas
- javascript
0 Cochrane1 Henryk Plötz0 Andreas
Hallo zusammen,
Ich probiere gerade ein HTML-Element incl. Inhalt (ein DIV) gegen ein vom Server im Hintergrund nachgeladenes (XMLHttpRequest) XML-Node auszutauschen.
Perfekt funktioniert's mit
e = document.getElementById('mynode');
e.outerHTML = req.responseText;
allerdings nur auf dem Internet Explorer. Firefox/Gecko unterstuetzt outerHTML aus politischen Gruenden nicht (was ich auch verstehe, es ist eigentlich eine Microsoft-proprietaere Erweiterung.
Ich habe schon probiert, mit e.parentNode.replaceChild(req.responseXML, e) den Node direkt im DOM auszutauschen. Dann haben die Knoten aber scheinbar den falschen Typ, denn z.B. im DOM Inspector vom Firefox sieht zwar alles okay aus, aber die Elementnamen sind ploetzlich klein statt grossgeschrieben und es werden quasi nur die Texte des nachgeladenen Fragments angezeigt, die Tags werden aber ignoriert.
Wie also kann ich (browseruebergreifend) ein HTML-Element austauschen, gegen das vom Server nachgeladene?
Das wuerde mich echt freuen wenn mir das jemand erzaehlen kann.
Viele Gruesse,
Andreas
Hallo,
Wenn outerHTML nicht geht, dann nimm doch innerHTML. Also einfach ein neues Element erzeugen, welches dann den Typ des neuen Elementes hat, und das alte damit ersetzen und dem neuen Element per innerHTML den neuen Inhalt zuweisen. Im Gegensatz zu outerHTML funktioniert innerHTML nämlich in allen aktuellen Webbrowsern prima, also auch in Gecko, Safari und so weiter.
Mit freundlichen Grüßen
Cochrane
Moin,
Ich habe schon probiert, mit e.parentNode.replaceChild(req.responseXML, e) den Node direkt im DOM auszutauschen.
Dass dir das nicht sofort mit "WRONG_DOCUMENT_ERR: Raised if newChild was created from a different document than the one that created this node." auf den Fuss gefallen ist, ist erstaunlich.
Beim Durchfliegen der Spec ist mir eben importNode() von document aufgefallen, das könnte dir evt. helfen.
Dass dir das nicht sofort mit "WRONG_DOCUMENT_ERR: Raised if newChild was created from a different document than the one that created this node." auf den Fuss gefallen ist, ist erstaunlich.
Ach, das heisst ich kann Knoten nur innerhalb eines Dokuments umhaengen?
Beim Durchfliegen der Spec ist mir eben importNode() von document aufgefallen, das könnte dir evt. helfen.
Ich habe dieses importNode auch gefunden:
e.parentNode.replaceChild(document.importNode(req.responseXML.documentElement, true), e);
liefert leider das gleiche Ergebnis wie ohne den Import, genau wie
e.parentNode.replaceChild(req.responseXML.documentElement.cloneNode(true), e);
Gruss,
Andreas
Moin,
Ach, das heisst ich kann Knoten nur innerhalb eines Dokuments umhaengen?
Also meiner Interpretation der Spec zufolge: Eigentlich[tm] ja.
e.parentNode.replaceChild(document.importNode(req.responseXML.documentElement, true), e);
liefert leider das gleiche Ergebnis wie ohne den Import, genau wie
e.parentNode.replaceChild(req.responseXML.documentElement.cloneNode(true), e);
Hmm, ja. Ich hab jetzt auch ein bisschen experimentiert (hatte vorher keine Zeit), und offenbar reicht es, einfach in dem XML den XHTML-Namespace zu benutzen:
http://www.ploetzli.ch/forumtst/replaceChild-1.html tut zumindest recht erfolgreich so, als würde es funktionieren. (Ich hab keine Ahnung von XMLHttpRequest und hab deshalb der Einfachheit halber ein iframe genommen.)