使用jQuery对DOM元素进行排序以排序数组

刚才我问了这个问题： javascript sort数组与订单数组一致，基于什么原因是一个错误的前提。 （我已经太久了，请给我rest一下）。

我真正需要做的是对DOM元素进行排序。 性能是我的应用程序的关键 ，因为它将在CPU非常糟糕的情况下运行。 所以我拥有的是这样的：

 
Jack
  
Jill
  
Nancy
  
Tom
  
Cartman
   

在JavaScript中：

 $modules = $('#moduleWrap .module'); order = [3,1,4,0,2]; 

我需要的是这个：

 
 
Tom
  
Jill
  
Cartman
  
Jack
  
Nancy
   

我（错误地）认为我可以对jQuery对象进行排序并简单地附加结果。 事实并非如此。

Answer 1

我只是遍历order数组并相应地重新排列DOM元素：

 var elements = []; $.each(order, function(i, position) { elements.push($modules.get(position)); }); $('#moduleWrap').append(elements); 

DEMO

为了提高性能，你可以带走越来越多的jQuery。 例如：

 var wrapper = document.getElementById('moduleWrap'); for(var i = 0, l = order.length; i < l; i++) { wrapper.appendChild($modules.get(order[i])); } 

DEMO

jQuery非常棒，因为它让事情变得简单，但如果你需要高性能，你应该宁愿不去。

Answer 2

试试这个。

从DOM树中分离元素可以加速该过程。

 $modules.detach(); var len = order.length, temp = []; for( var i = 0; i < len; i++ ) { temp.push( $modules[ order[i] ] ); } $("#moduleWrap").append( temp ); 

小提琴这里http://jsfiddle.net/rEFu3/

Answer 3

我知道这已经很晚了，但也许会有所帮助。 我试图做类似的事情和#Felix Kling的回答让我90％。 但在我的情况下，我有一个等于订单值的div id，如下所示：

 order = [3,1,4,0,2]; 
Jack
  
Jill
  
Nancy
  
Tom
  
Cartman
  

然后我可以使用位置值简单地推送元素

 var elements = []; $.each(order, function(i, position) { elements.push($('#'+position)); }); $('#moduleWrap').append(elements);