10

ライブラリはありません。私のコントロールを超え。

ドキュメントフラグメントを dom に追加しています。これはすべて機能します。問題ありません。

フラグメントが追加された後、ノード リストを保持/取得するにはどうすればよいですか? 関連コード:

var frag = document.createDocumentFragment();
//add some content to the fragment
element.appendChild(frag);

繰り返しますが、これはうまくいきます！DOM に何かを追加する方法についてのトラブルシューティングは必要ありません。

を設定var e = element.appendChild(frag);すると、すべてが正常に追加されますが、e= 空のドキュメント フラグメントです。

ここで滑らかな魔法のブードゥー教を探しています。dom 全体をループさせないでください。コンテンツは、子の有無にかかわらず、1 つまたは複数のノードである可能性があります。querySelectorAll または許容される何かに何らかのトリックがある場合。

ありがとう！

EDIT さらに突き詰めると、e上記は実際にはvarへの返された参照でありfrag、domに追加した後は空であることがわかります。要素がフラグメントからドームにきれいに滑り落ち、フラグメントが空っぽになったようなものです。

4

5 に答える 5

19

それはまさにあなたが説明したものです。要素が要素に追加されると、それらはフラグメントから削除され、参照が残ることによるメモリ リークが防止されます。

childNodesこれらの子ノードを取得する 1 つの方法は、実行する前にフラグメントの浅いコピーを作成することappendChild()です。

// make shallow copy, use Array.prototype to get .slice() goodness
var children = [].slice.call(frag.childNodes, 0);

element.appendChild(frag);

return children;
于 2012-11-12T16:17:26.707 に答える
5

あなたがそれを追加した直後に見ているなら、それlastChildは行く方法です。次のように使用します。

var e = element.lastChild;

SitePointの詳細

于 2012-11-12T16:16:37.797 に答える
2

DocumentFragmentのドキュメントから：

他のさまざまなメソッドは、ドキュメントフラグメントを引数として取ることができます（たとえば、appendChildやinsertBeforeなどのノードインターフェイスメソッド）。この場合、フラグメント自体ではなく、フラグメントの子が追加または挿入されます。

したがってappendChild、メソッドはdocumentFragmentを返しますが、その子ノードがelementオブジェクトに挿入されているため（appendChild docから）空です。

[...]ノードをドキュメントの2つのポイントに同時に配置することはできません。したがって、ノードにすでに親がある場合は、最初に削除され、次に新しい位置に追加されます。

今...あなたはあなたの子供をキャッシュ配列に保存し、それを返した後にそれを返すことができます（またはジャックの解決策を参照してください:-)）

于 2012-11-12T16:24:09.280 に答える
2

Array.fromジャックのソリューションと同様ですが、esnext を使用している場合は、次のように使用できます。

const children = Array.from(frag.children);

element.appendChild(frag);

return children;
于 2018-08-03T16:46:35.557 に答える