2

假设我有一个包含一堆有序元素的集合，在它的抽象 order-position插入另一个新子元素的常用方法是什么？

使用 dom 库$(new).eq($(new).data('orderPosition'));不起作用，因为它不是有效的索引。

// 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

为什么不将订单位置存储在数组中，然后使用它计算索引？这是更好的解决方案，因为读取 DOM 属性消耗的 CPU 比仅循环遍历数组并将新项目与现有项目进行比较要多得多

于 2013-02-07T23:08:11.723 回答