Dut*_*432 2 arrays sorting jquery
如果有一个Javascript ID数组
var myArray = ['2', '1', '3'];
Run Code Online (Sandbox Code Playgroud)
现在,我还有一组具有相应ID的DIVS.
<div id='container'>
<div id='item1'>1</div>
<div id='item2'>2</div>
<div id='item3'>3</div>
</div>
Run Code Online (Sandbox Code Playgroud)
有没有一种简单的方法可以根据数组顺序对这些div进行排序?我已经反复围绕divs循环并使用insertBefore()和insertAfter()重新安排项目的想法,但我想知道是否有更好的方法..
这就是我到目前为止所提出的(JSFiddle DEMO)
(function( $ ){
$.fn.jaySort= function(prefix, lst) {
var prev=null;
for (var x=0; x<lst.length; x++){
if (!prev) prev = $('#placeHolder');
$('#' + prefix + lst[x]).insertAfter(prev);
prev = $('#' + prefix + lst[x]);
}
};
})( jQuery );
///////////////////////////////////////////
var myArray = ['2', '1', '3'];
$('#container').jaySort('item', myArray);
Run Code Online (Sandbox Code Playgroud)
UPDATE
根据下面接受的答案,代码已经改进为:
(function( $ ){
$.fn.jaySort= function(prefix, lst) {
for (var x=0; x<lst.length; x++)
$(this).append($('#' + prefix + lst[x]));
};
})( jQuery );
$('#container').jaySort('item', ['3', '2', '1']);
Run Code Online (Sandbox Code Playgroud)
这也有效(而且更短)
<div id='container'>
<div id='item1'>1</div>
<div id='item2'>2</div>
<div id='item3'>3</div>
</div>
var myArray = ['2', '1', '3'];
$.each(myArray,function(index,value){
$('#container').append($('#item'+value));
});
Run Code Online (Sandbox Code Playgroud)