yast another dom unverstäandniss - wieso hat das kind keinen inhalt?

[Shade Of Mine]

CSS funktioniert definitiv auch mit innerHTML. Kann aber natürlich ein paar quirkse geben. innerHTML ist da nicht immer perfekt.

Was übrigens ein weitrer Grund für jQuery wäre

Wenn es ohne innerHTML gehen soll, würde ich aber den DOM Tree so aufbauen:

var outer=document.createElement("div");
  var inner=document.createElement("span");

  var text1=document.createTextNode("X");
  var text2=document.createTextNode("x");

  inner.appendChild(text2);

  outer.appendChild(text1);
  outer.appendChild(inner);

  var wrapper = document.createElement("td");
  wrapper.appendChild(outer);
  wrapper.setAttribute("id", "1_1");

  var elem = document.getElementById("1_1"); //das td element
  elem.parentNode.replaceNode(wrapper, elem);

bzw. würde ich statt td ein leeres span aufziehen und das immer austauschen damit im td so sachen wie id usw ohne probleme erhalten bleiben können.

Aber wie gesagt, das ist furchtbar kompliziert und anstrengend. geht alles viel viel viel einfacher.

Wenn du es aber so machst, ist es wichtig nur an wenigen zentralen Stellen den DOM Tree anzufassen. In meinem Beispiel mache ich das nur in der letzten Zeile. Dies bewirkt ein reflow des Dokuments. Die interessanten Stichwörter hier sind reflow und repaint. Beides will man minimieren aber reflows sind oft versteckt.

Siehe zB: http://dev.opera.com/articles/view/efficient-javascript/?page=3