4

リスト（または実際には子を持つ要素）を分割する関数をjQueryで記述しようとしています。これは、メモリの使用を意識し、広く再利用できるほど一般的ですが、これらを相互に解決するのに問題があります。 。

議論のために（そしてコードを適切に保つために）、要素3の後にリストを2つのリストに分割しようとしているとしましょう。コードに構文エラーなどがないかチェックしていません。私が何をしようとしているのかがわかるといいのですが。

オプション1は、次のような関数を作成することです。

var list = $('ul.listCopy');
var newList = $('<ul class="listCopy" />');
var latterElements = list.children('li:gt(3)').remove();
newList.append(latterElements);
list.after(newList);

これは素晴らしいことですが、要素のタイプと属性を知っている場合にのみ機能します。複数のdivを含むdivを分割したり、OLを分割したりする場合は、別の関数を作成する必要があります。要素にクラス、ロール、またはその他のhtml属性がある場合、将来どのようなカスタム属性が表示されるかを気にせずにコピーできるようにしたいと思います。あらゆる種類の要素を処理できるように、これを十分に一般的にしたいと思います。これはオプション2です。

var list = //something
var newList = list.clone();
newList.children(':lt(4)').remove();
list.children(':gt(3)').remove();

これは私が何でもコピーできるほど一般的ですが、問題は私がリスト全体のコピーを作成しているということです。このプログラムを使用して特に長いリストを分割する必要がある場合、メモリへの影響が心配です。

私がやりたい理想的なことは、要素のコピーを作成することですが、要素自体のみをコピーし、その子はコピーしません。削除してしまうものをコピーする必要はありません。このようなことをする方法はありますか？私が見たプラグインと関数のほとんどは、どちらかの方法を選択します。

ありがとう！

4

1 に答える 1

1

ネイティブcloneNode()メソッドを使用します。true引数として渡さない場合、子のクローンは作成されません。

例： http： //jsfiddle.net/4rYxE/

    // Original element
var list = $('ul');
    // Clone of original (top level only)
var newList = list[0].cloneNode();
    // Append children greater than index 3 to the new element
list.children(':gt(3)').appendTo(newList);

を使用.appendTo()すると、元のリストから要素が削除され、新しい場所（この場合はnewList）に移動されます。

于 2010-10-03T23:10:31.310 に答える