使用 Jquery 按 ID 值的降序对分区进行排序答案

【问题标题】：Using Jquery to sort divisions in a descending order regarding ID values使用 Jquery 按 ID 值的降序对分区进行排序
【发布时间】：2015-07-07 12:03:21
【问题描述】：

假设我有一些返回的动态代码：

<div id="data-2">data 2</div>
<div id="data-10">data 10</div>
<div id="data-1">data 1</div>

如何使用 Jquery 以降序对分区进行排序，以便最终获得以下 HTML：

<div id="data-10">data 10</div>
<div id="data-2">data 2</div>
<div id="data-1">data 1</div>

有什么想法吗？

【问题讨论】：

Sort Divs in Jquery Based on Attribute 'data-sort'?的可能重复

标签： jquery

【解决方案1】：

你可以使用：

 $('div').sort(function (a, b) {
   var contentA =parseInt( $(a).attr('id').replace('data-',''));
   var contentB =parseInt( $(b).attr('id').replace('data-',''));
   return (contentA > contentB) ? -1 : (contentA < contentB) ? 1 : 0;
 });

【讨论】：

【解决方案2】：

这可能对你有帮助！

var resultSort = [];

    $('.data').each(function(index) {
        var getId = $(this)[0].id;
        var splitedId = getId.split('-')[1];
        resultSort.push(splitedId);
        // sort the the array
        var sorted = resultSort.sort(function(x,y){
            return x[0] - y[0];
        });
        var div = '<div id="data-' + sorted[index] +'">data ' + sorted[index] + '</div>';
        $(div).appendTo('#result');
    });

演示：http://jsfiddle.net/60rmg5v1/

更新

var resultSort = [];
$('.data').each(function(index) {
    var getId = $(this)[0].id;
    var splitedId = getId.split('-')[1];
    resultSort.push(splitedId);
    // sort the the array
});
var sorted = resultSort.sort(function(a,b){
        return b - a;
    });

for ( var i = 0; i < sorted.length; i ++ ) {
    var div = '<div id="data-' + sorted[i] +'">data ' + sorted[i] + '</div>';
    $(div).appendTo('#result');
}

Demo

【讨论】：

谢谢，但它显示：data 10 "data 1 data 2 This is sorted element data 10 data 1 data 2" 而不是降序数据..
我更新了演示，您现在可以检查它是否适合您！：）好好享受！ :)

【解决方案3】：

这个答案有帮助：How to order divs by id in javascript?

<div id="container">
  <div id="data-2">data 2</div>
  <div id="data-10">data 10</div>
  <div id="data-1">data 1</div>
</div>

<script>
var main = document.getElementById( 'container' );

[].map.call( main.children, Object ).sort( function ( a, b ) {
    return +b.id.match( /\d+/ ) - +a.id.match( /\d+/ );
}).forEach( function ( elem ) {
    main.appendChild( elem );
});

</script>

按如下方式排序：

<div id="container">
  <div id="data-10">data 10</div>
  <div id="data-2">data 2</div>
  <div id="data-1">data 1</div>
</div>

谢谢大家！！

【讨论】：