Javascript insertBefore出错，未插入所有元素

如果您摆弄标记字符串，例如，在移动节点之前调用Insert时，在>之间放置空格，使其成为referenceTag.parentNode的子节点。此时，它不再是newElement的子节点，因此newElement.childNodes将收缩1

然后增加i，所以一直跳过元素

i、 e

您可以移动节点0 原来的节点1变成了节点0 移动新节点1，保留旧节点1和当前节点0。 您可能想要：

[ elementNode, elementNode, elementNode ]

---

如果您摆弄标记字符串，例如，在插入节点时，在>之间放置空格：

 referenceTag = document.getElementById('myElement');
    var newElement = document.createElement('div');
    newElement.innerHTML = '<div>text1</div><pre>text2</pre><p>text3</p>';
    var storeLength = newElement.childNodes.length
    for (i=0; i<storeLength; i++) {
        alert(newElement.childNodes[0].tagName);
        //if you comment-out following line there are 3 alerts but otherwise only two.
     referenceTag.parentNode.insertBefore(newElement.childNodes[0],referenceTag);
    }

newElement.childNodes.length的长度始终减少1。此外，当您先删除元素再删除其他元素时，元素的索引会发生变化，因此您应该存储for循环的长度，并始终使用索引0：

i = 0
newElement.childNodes[0] == '<div>'
newElement.childNodes[1] == '<pre>'
newElement.childNodes[2] == '<p>'
newElement.childNodes.length == 3

示例：

问题在于newElement.childNodes是节点的活动集合。因此，每当您访问它的属性时，集合都会重新评估、更新以反映DOM的当前状态

例如：

第一次迭代

i = 2
newElement.childNodes[0] == '<pre>'
newElement.childNodes.length == 1

该元素已添加前缀

第二次迭代：

元素的前面加了前缀

第三次迭代：

由于条件未满足，循环停止

referenceTag.parentNode.insertBefore(newElement.childNodes[i],referenceTag);

 referenceTag = document.getElementById('myElement');
    var newElement = document.createElement('div');
    newElement.innerHTML = '<div>text1</div><pre>text2</pre><p>text3</p>';
    var storeLength = newElement.childNodes.length
    for (i=0; i<storeLength; i++) {
        alert(newElement.childNodes[0].tagName);
        //if you comment-out following line there are 3 alerts but otherwise only two.
     referenceTag.parentNode.insertBefore(newElement.childNodes[0],referenceTag);
    }

i = 0
newElement.childNodes[0] == '<div>'
newElement.childNodes[1] == '<pre>'
newElement.childNodes[2] == '<p>'
newElement.childNodes.length == 3

i = 1
newElement.childNodes[0] == '<pre>'
newElement.childNodes[1] == '<p>'
newElement.childNodes.length == 2

i = 2
newElement.childNodes[0] == '<pre>'
newElement.childNodes.length == 1