2

よく順序付けられた要素の束を持つコレクションがあると仮定すると、別の新しい子を抽象 order-positionに挿入する一般的な方法は何ですか?

$(new).eq($(new).data('orderPosition'));有効なインデックスではないため、dom ライブラリの使用は機能しません。

// Add this element to it's logic position in the collection:
<div data-order-position="10"></div>

// The collection
<div id="myCollection">
   <div data-order-position="4"></div>
   <div data-order-position="67"></div>
   <div data-order-position="81"></div>
   <div data-order-position="82"></div>
   <div data-order-position="761"></div>
</div>

私の実際のコレクションには、約 400 個の要素が含まれています。

4

2 に答える 2

3

整数の配列を操作するのがおそらく最も効率的な方法だと思います。配列内のソートされた要素の一定のリストをどこかに維持できます (必要に応じてソートを続行することもできます)。

//Array of positions
var positions = [];

//Initially set up the array in question
//divs are already sorted, as we know
$("#myCollection div").each(function () {
   positions.push(parseInt(this.dataset.orderPosition)); 
});

//Create the new node we want to insert (in your case it may already exist)
var $new = $("<div>").data('order-position', 10).text(10);

//Append the new node index (if node already exists, just use `.data` as above)
positions.push(10);

//Yes, for whatever reason JS sorts by string and not number by default.
//There may also be a more efficient way to add the integer in the correct spot
//without having to sort all over again, but this is fast enough
positions.sort(function (a, b) {
    return a - b;
});

//Insert the new node!
$("#myCollection div").eq(positions.indexOf(10) - 1).after($new);

http://jsfiddle.net/ExplosionPIlls/ULEFX/

于 2013-02-07T23:12:53.267 に答える
0

order-position を配列に格納してから、それを使用してインデックスを計算してみませんか? DOM プロパティを読み取ると、配列をループして新しい項目を既存の項目と比較するよりもはるかに多くの CPU を消費するため、はるかに優れたソリューションです。

于 2013-02-07T23:08:11.723 に答える