2010-11-19 15 views
4

ページのDOMツリーがアクティブで、常にブラウザに反映されているため、実際のレンダリングツリーに影響を与えずにこのDOMツリーを何らかの目的のために変更する最良の方法は何ですか?私の目的が特定の子ノードを交換し、DOMツリーがどれほど似ているかを見てみましょう。Javascript DOMツリー操作の複製

重複するツリーを作成するのは唯一の解決策ですか?もしそうなら、これを行う関数がありますか?または、ツリーの複製コピーを作成する独自の関数を記述する必要があります。私は要素オブジェクトのすべての属性を必要としないので、兄弟や子供を指すいくつかの属性を持つ簡単なオブジェクトを作成できます。

答えて

5

document.cloneNode(true)を使用するか、別のノードで同じ方法を使用できます。 cloneNodeは任意のノードをクローンし、trueは再帰的(深い)であることを意味します。明らかに、これは大きなページで大きなパフォーマンスコストを発生させる可能性があります。

+0

しかし、新しいノードのchildNodesプロパティは、依然として元のノードの子を指しています。サブツリー全体がクローン化されますか? – euphoria83

+0

が正しい。ありがとう。 – euphoria83

0

多くの素晴らしいJavaScriptライブラリがあると考えられます。 jQuery。これにより、ドキュメントのDOMの一部または全体を簡単にコピーし、DOMから格納されたappartを持つことができます。

独自のソリューションを展開する必要がある場合は、Resigの投稿記事(http://ejohn.org/blog/dom-documentfragments/)を開始するのがよいでしょう。

幸運。あなたはjQueryのを使用して喜んでいる場合

1

は:

var clone = $("selectorForSomeElement(s)").clone(); 

cloneは現在、素子構造のコピーです。

あなたは、あなたが好きな実験をするためにクローンから取り除くことができます。