nicht angemeldet
Hallo,
ich suche verzweifelt einen Ersatz für innerHTML in DOM. Es gibt zwar innerText, nämlich createTextNode(), was was ich brauche, wäre sowas à la createHtmlTree(), was es offensichtlich nicht gibt.
Nein, aber createElement() und createAttribute(), appendChild() und setAttributeNode().
http://selfhtml.teamone.de/javascript/objekte/document.htm
Gibt es einen Ersatz dafür?
Ja. Du musst alle Elemente des gewünschten HTML-Tree erzeugen und _richtig_ zusammensetzen.
Bsp.:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>innerHTML vs. DOM</title>
<script type="text/javascript">
<!--
function mitInnerHTML() {
document.getElementById("dynBereich1").innerHTML="<h1>Ueberschrift</h1><p>Textabsatz</p><table border='1'><tr><td>TabellenZelle</td></tr></table>";
}
function mitDOM() {
var h1txt = document.createTextNode("Ueberschrift");
var h1 = document.createElement("h1");
h1.appendChild(h1txt);
document.getElementById("dynBereich2").appendChild(h1);
var ptxt = document.createTextNode("Textabsatz");
var p = document.createElement("p");
p.appendChild(ptxt);
document.getElementById("dynBereich2").appendChild(p);
var tdtxt = document.createTextNode("TabellenZelle");
var tbl = document.createElement("table");
var tbody = document.createElement("tbody");
var tr = document.createElement("tr");
var td = document.createElement("td");
td.appendChild(tdtxt);
tr.appendChild(td);
tbody.appendChild(tr);
tbl.appendChild(tbody);
var brd = document.createAttribute("border");
brd.nodeValue = "1";
tbl.setAttributeNode(brd);
document.getElementById("dynBereich2").appendChild(tbl);
}
//-->
</script>
</head>
<body>
<div id="dynBereich1"></div>
<button onclick="mitInnerHTML();">Setzte Inhalt mit innerHTML</button>
<div id="dynBereich2"></div>
<button onclick="mitDOM();">Setzte Inhalt mit DOM</button>
</body>
</html>
viele Grüße
Axel