Javascript 将一个分区的子元素以及所有关联事件复制到另一个分区

我正在尝试将某个div元素

parent

替换为另一个

newparent

。我只想复制一些

parent

的子项，并将它们放入

newparent

，然后用

newparent

替换

parent

。 以下是我的代码片段：

var sb_button = parent.firstChild;
    var temp;
    while(sb_button) {
        console.log("loop: ");
        console.log(sb_button.id);
        temp = sb_button;
        if(sb_button.id != curr_button.id && sb_button.id != prev_button.id) {
            console.log("if");
            newparent.appendChild(temp);
            }
        else if(sb_button.id == curr_button.id) {
            console.log("elseif");
            newparent.appendChild(temp);
            newparent.appendChild(prev_button);
            }
        else {
            console.log("else");
            }
        sb_button.parentNode = parent;
        console.log(sb_button.id)
        console.log(sb_button.parentNode.children);
        sb_button = sb_button.nextSibling;
        }
    parent.parentNode.replaceChild(newparent,parent);

编辑：

---

因此，当我执行

newparent.appendChild（temp）

时，它会修改

sb_按钮

。解决方法是什么？

我还没有运行您的代码，但是有一些奇怪的事情，可能其中之一会导致问题，或者有助于清理代码，使问题更加明显

• 变量

  temp

  似乎是

  sbu按钮的别名：您可以删除变量声明并用
  temp
  替换所有引用

• sb_按钮

  对于任意子节点来说是一个容易混淆的名称
• 您正在if语句中将

  sb_按钮中的节点添加到
  newparent
  ，但就在您尝试将
  sb_按钮设置为
  parentNode
  后，parentNode
  添加到
  parent
  -这当然没有意义-您不能将元素添加到一个元素，但具有不同的父元素

• 您正在尝试复制或移动节点吗

编辑：如果您想复制节点，我相信您正在寻找：复制节点并附加该副本，而不是原始节点

作为一个干净的设计，当事情变得复杂时，我会避免这种难以推理的while循环。相反，只需制作一个节点数组，按照您想要的方式排序（您甚至可以使用

sort

进行排序，使其立即变得明显，您只是在重新排列内容），然后制作一个函数，该函数接受

newparent

和数组，并按数组顺序将所有元素的副本附加到

newparent

。您的示例并没有那么复杂，但即使在这里，我也会更改if子句的顺序，使其在最后的else中具有“default”大小写。e、 g:

for(var child = parent.firstChild; child; child = child.nextSibling) 
    if(child.id == curr_button.id) { //insert prev_button after curr_button
        newparent.appendChild(child.cloneNode(true));
        newparent.appendChild(prev_button.cloneNode(true));
    } else if(child.id != prev_button.id) {
        newparent.appendChild(child.cloneNode(true));
    }
parent.parentNode.replaceChild(newparent, parent);

---

这样做的目的是让读者立即明白，所有的孩子都只被处理了一次。

那么出了什么问题？您已经插入的所有日志记录都记录了什么？假设我在parent中有4个兄弟姐妹，我想重新排列兄弟姐妹的排列方式。（假设开始时是1234，我想根据条件做1234）。我已经纠正了你提到的第三点。那么，如何将

sb_按钮的确切行为复制到
temp
，现在对
temp
的修改不应影响
sb_按钮
？