Hi,
<body id="body">
<div id="a"><p>A1</p><p>A2</p><p>A3</p></div>
<div id="b"><p>B1</p> <p>B2</p> <p>B3</p></div>
<hr>
<script type="text/javascript">
[code lang=javascript]var a = document.getElementById('a').childNodes;
alert(a.length);
var b = document.getElementById('b').childNodes;
alert(b.length);
var n = document.createElement('div');
for(var i=0; i<a.length; i++){
alert(a[i]);
n.appendChild(a[i]);
}
for(var i=0; i<b.length; i++){
n.appendChild(b[i]);
alert(b[i]);
}
document.getElementsByTagName('body')[0].appendChild(n);
>
> Bei fehlendem Whitespace werden nicht alle Elemente erkannt (Fx).
> Nur A1 und A3 werden umgehängt.
> Warum?
Weil NodeLists per Spezifikation „live“ sind, und immer den aktuellen Zustand des DOM abbilden.
Wenn du ein Element per appendChild umhängst und damit aus #a bzw. #b entfernst, ist es danach nicht mehr in deren childNodes-NodeList enthalten - mit deinen Schleifen überspringst du also Elemente.
Bei #b sind das zufälligerweise die Whitespace-Knoten - bei #a hingegen ist es das P-Element mit dem Inhalt A2.
MfG ChrisB
--
RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?