3

parent特定のdiv要素を別の要素に置き換えようとしていnewparentます。parentの子の一部だけをコピーして入れてから、をnewparentに置き換えたいと思います。これが私のコードの抜粋です：parentnewparent

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ます。これの回避策は何ですか？

4

1 に答える 1

4

私はあなたのコードを実行していませんが、いくつかの奇妙なことがあります。おそらくそのうちの1つが問題を引き起こしたり、コードをクリアして問題をより明確にするのに役立つ可能性があります。

  • 変数は次tempのエイリアスのようですsb_button：変数宣言を削除して、すべての参照を次のように置き換えることができますtemp
  • sb_button任意の子ノードの紛らわしい名前です
  • ifステートメント内にノードを追加していますがsb_button、newparent設定しようとした直後sb_button_.parentNodeにparent-は読み取り専用であり、確かに意味がないため、これは不可能です-要素を1つの要素に追加することはできませんがparentNode別の親がいます。
  • ノードをコピーまたは移動しようとしていますか？

編集：ノードをコピーしたい場合は、探していると思いますcloneNode：ノードのコピーを作成し、元のノードではなく、そのコピーを追加します。

クリーンなデザインの問題として、物事が複雑になったとき、私はこの種の理由のないwhileループを避けたいと思います。代わりに、ノードの配列を作成し、必要な順序で並べ替えて（これを使用sortして、物事を再配置していることがすぐにわかるようにすることもできます）、newparent配列を取り、コピーを追加する関数を作成します。配列順にすべての要素のnewparent。あなたの例はそれほど複雑ではありませんが、ここでも、if句の順序を変更して、最後のelseで「デフォルト」の場合を使用します。例えば：

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);

すべての子が正確に1回処理されることを読者に即座に明らかにするという考えです。

于 2011-06-06T07:27:12.950 に答える