outerHTML - Ersatz für Netscape
Stephan Schmitt
- javascript
0 Gernot Back0 Stephan Schmitt0 Axel Richter0 molily
0 Cybaer
Hallo Leute,
hoffentlich kann mir hier jemand helfen bei einer (für mich) harten Nuß. Ich komme sonst irgendwie nicht weiter...
Folgendes Problem:
In meinem JavaScript werden sehr viele Bereiche mit outerHTML überschrieben. Diese Bereiche werden später dann mit der ID des jeweiligen Elements angesprochen. Diese Elemente bestehen bei Start des Skriptes allerdings noch nicht, sondern werden dynamisch erstellt. Sie ändern sich auch sowohl in der Anzahl, sowie in der Anzahl der untergeordneten Elemente. Im weiteren Verlauf müssen diese Elemente dann als Ganzes zu löschen sein oder aber auch an gleicher Stelle neu zu erstellen sein.
Der (vereinfachte) Syntax im Moment:
document.getElementById(ContId).outerHTML = "<div id='" + DynID + "'>" + Ele1 + Ele2 + ... + "</div>";
Wie kann ich nun unproblematisch einen Ersatz dafür schaffen für die Netscape Variante? Habe schon ein paar Versuche mit Nodes hinter mir, kriege das Ganze aber nicht hin.
Der outerHTML war dafür einfach genial!!
Nun hoffe ich daß mir jemand weiterhelfen kann.
Hilfe wäre absolut prima!
Grüsse Stephan
Hallo Stephan,
document.getElementById(ContId).outerHTML = "<div id='" + DynID + "'>" + Ele1 + Ele2 + ... + "</div>";
Wie kann ich nun unproblematisch einen Ersatz dafür schaffen für die Netscape Variante? Habe schon ein paar Versuche mit Nodes hinter mir, kriege das Ganze aber nicht hin.
Schau doch mal in den Quelltext dieser Seite:
http://dhtml.seite.net/start.html
view-source:http://dhtml.seite.net/start.html
Da liest man z.B. so etwas:
if(navigator.appName=="Netscape")
with(document.ticker.document)
{
open(); write(out); close();
}
else
ticker.innerHTML=out;
pos+=dir;
Nun geht es hier wohl mit document.write() um einen Ersatz für innerHTML, aber das geht doch vielleicht auch als Ersatz für outerHTML.
Gruß Gernot
Hallo Gernot
Da liest man z.B. so etwas:
if(navigator.appName=="Netscape")
with(document.ticker.document)
{open(); write(out); close();}
else ticker.innerHTML=out;
Das geht schon stark in die Richtung, aber ich müsste auch den äußeren Bereich <div>..</div> mit überschreiben. Das ist damit leider nicht machbar. Habe auch versucht mit dem vorhergehenden Element zu arbeiten, aber dann findet er das Ende </div> nicht.
Nun geht es hier wohl mit document.write() um einen Ersatz für innerHTML, aber das geht doch vielleicht auch als Ersatz für outerHTML.
innerHTML wird übrigens von Netscape interpretiert. Warum wurde eigentlich der innerHTML in Netscape integriert und der outerHTML nicht?
Gruß Stephan
Hallo Stephan,
Das geht schon stark in die Richtung, aber ich müsste auch den äußeren Bereich <div>..</div> mit überschreiben. Das ist damit leider nicht machbar. Habe auch versucht mit dem vorhergehenden Element zu arbeiten, aber dann findet er das Ende </div> nicht.
Mit dem vorhergehenden meinst du den parentNode und nicht previousSibling?
Du könntest vielleicht mit einer Kombination aus parentNode und replaceChild arbeiten.
http://de.selfhtml.org/javascript/objekte/node.htm#replace_child
Oder du machst es halt doch mit innerHTML, musst dann halt jeweils noch ein <div> oder <span>-Element drumherum bauen. Auch bei den neueren Netscapes kann man dabei aber mit open(),write(),close() arbeiten, muss man vielleicht sogar, so etwas habe ich schon gemacht, in Anlehnung an die genannte DHTML-Seite:
http://home.arcor.de/gernotback/sau.html
(Nur eine Studie und wahrscheinlich nicht ganz valide)
Mit Mozilla flackert das halt ziemlich, zumindest auf meinem alten Rechner. Mit Opera (7.11) läuft es auch nicht so, wie ich mir das vorstelle, wahrscheinlich weil es da eine Obergrenze für Schriftgrößen gibt.
Gruß Gernot
Hallo,
Da liest man z.B. so etwas:
if(navigator.appName=="Netscape")
with(document.ticker.document)
{
open(); write(out); close();
}
else
ticker.innerHTML=out;pos+=dir;
Nun geht es hier wohl mit document.write() um einen Ersatz für innerHTML,
Ja, aber nur für Netscape < Version 6. Die Gecko-Netscapes kennen das Konzept des Dokuments im Layer nicht mehr. Ein Ersatz für .innerHTML könnte wie folgt aussehen:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>InnerHML-Ersatz</title>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
</head>
<body>
<div id="hierInnerHTML" name="hierInnerHTML" style="position:relative;"> </div>
<script type="text/javascript">
<!--
if (document.all) {
document.all["hierInnerHTML"].innerHTML = "<h1>Hallo Welt, mit .all</h1>"
} else if (document.layers) {
document.layers["hierInnerHTML"].document.write("<h1>Hallo Welt, mit .layers</h1>");
} else if (window.opera && document.getElementById) {
document.getElementById("hierInnerHTML").document.write("<h1>Hallo Welt, mit .getElementById und Opera < 7</h1>");
} else if (document.getElementById) {
var myH1 = document.createElement("H1");
var myText = document.createTextNode("Hallo Welt, mit DOM");
myH1.appendChild(myText);
document.getElementById("hierInnerHTML").replaceChild(myH1,document.getElementById("hierInnerHTML").firstChild);
}
//-->
</script>
</body>
</html>
Leider habe ich keinen NC4.x mehr, kann also nicht testen, ob ich das mit den LAYERs richtig gemacht habe. Wenn nicht, wäre ich für eine Rückmeldung dankbar. Der DOM-Ersatz funktioniert natürlich nur, wenn das Element, auf welches das innerHTML angewendet werden soll, nur einen Kindkonten hat.
aber das geht doch vielleicht auch als Ersatz für outerHTML.
Nein. Der DOM-Ersatz für .outerHTML scheitert an der nicht vorhandenen Methode, einen kompletten Knoten durch einen anderen zu ersetzen, wenn man nicht dessen Elternknoten hat. Man kann nur Kindknoten _in_ einem Knoten ersetzen. Das Ermitteln des Elternknotens eines Kindknotens ist ebenfalls nicht möglich.
viele Grüße
Axel
Hallo,
Der DOM-Ersatz für .outerHTML scheitert an der nicht vorhandenen Methode, einen kompletten Knoten durch einen anderen zu ersetzen, wenn man nicht dessen Elternknoten hat. Man kann nur Kindknoten _in_ einem Knoten ersetzen. Das Ermitteln des Elternknotens eines Kindknotens ist ebenfalls nicht möglich.
Was spricht gegen parentNode? (Missverstehe ich dich?)
Mathias
Hallo,
Was spricht gegen parentNode? (Missverstehe ich dich?)
Uups. Das habe ich jetzt glatt übersehen, nachdem ich mit previousSibling nicht zum Erfolg kam. Danke für den Hinweis.
Dann kann man .outerHTML doch relativ einfach mit DOM ersetzen:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>OuterHML-Ersatz</title>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
</head>
<body>
<div id="hierOuterHTML"><h2>Das wird ersetzt.</h2><p>und das auch.</p></div>
<p>Das sollte aber nicht ersetzt werden.</p>
<script type="text/javascript">
<!--
if (document.getElementById) {
var myH1 = document.createElement("H1");
var myText = document.createTextNode("Hallo Welt, mit DOM");
myH1.appendChild(myText);
document.getElementById("hierOuterHTML").parentNode.replaceChild(myH1, document.getElementById("hierOuterHTML"));
}
//-->
</script>
</body>
</html>
viele Grüße
Axel
Hi,
Schau doch mal in den Quelltext dieser Seite:
Da liest man z.B. so etwas:if(navigator.appName=="Netscape")
Das ist ja schon eine "JavaScript-Todsünde"! Auch wenn das Script "etwas" veraltet ist: Funktionalität nicht mittels der Funktionalität (hier: existiert innerHTML?), sondern mittels Browsernamen zu definieren, war IMHO schon immer eine ... =:-o
Gruß, Cybaer