将一个分区的子元素与所有相关事件一起复制到另一个分区

时间:2011-06-06 07:17:48

标签: javascript html appendchild

我正在尝试将另一个div parent替换为newparent。我只想复制parent个孩子中的一些并将其放在newparent中,然后将parent替换为newparent。 以下是我的代码片段:

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_button。这是什么解决方法?

1 个答案:

答案 0 :(得分:4)

我没有运行你的代码,但有一些奇怪的事情,也许其中一个可能导致问题或帮助清理代码,所以问题更明显。

  • 变量temp似乎是sb_button的别名:您可以删除变量声明并将所有引用替换为temp
  • sb_button是任意子节点的混淆名称
  • 您将sb_button中的节点附加到if语句中的newparent,但是在您尝试将sb_button_.parentNode设置为parent之后 - 那是{{ 3}}它当然没有意义 - 你不能将元素附加到一个元素但是有一个不同的父元素。
  • 您是在尝试复制还是移动节点?

编辑:鉴于您要复制节点,我相信您正在寻找not possible since parentNode is readonly:制作节点的副本并附加该副本,而不是原始节点。< / p>

作为一个干净的设计问题,当事情变得复杂时,我会避免这种难以理解的while循环。相反,只需创建一个节点数组,按照你想要的方式排序(你甚至可以使用sort来实现这一点,以便立即显示你只是重新排列事物),然后创建一个带有{的函数{1}}和数组并将数组顺序中所有元素的副本追加到newparent。你的例子并不复杂,但即使在这里,我也会改变if子句的顺序,使其在最后的其他方面具有“默认”的情况。 e.g:

newparent

这个想法是让读者立刻明白所有孩子只需处理一次。