如何使用javascript按编号的类对div进行排序？

我希望遍历每个网格行，按照position类以数字顺序对子div进行排序。因此，位置_1将始终是每个网格行中的第一个子div

---

当我尝试使用jQuery执行此操作时，子div被排序到其他行中，这是我需要防止的。如何实现这一点？

在每个

网格行中的
网格单元格中使用
排序


$（'.grid row'）。每个（函数（）{
var cells=$（'.grid cell'，this）.sort（函数（a，b）{
返回parseInt（a.className.match（/[0-9]+/）[0]）>parseInt（b.className.match（/[0-9]+/）[0]）；
});
$（this）.html（单元格）；
});

2.
1.
2.
3.
1.
2.
1.
在每个
网格行中的
网格单元格上使用
排序


$（'.grid row'）。每个（函数（）{
var cells=$（'.grid cell'，this）.sort（函数（a，b）{
返回parseInt（a.className.match（/[0-9]+/）[0]）>parseInt（b.className.match（/[0-9]+/）[0]）；
});
$（this）.html（单元格）；
});

2.
1.
2.
3.
1.
2.
1.
我知道你问过一个JavaScript解决方案，但是你也可以考虑看Frasbox。你可以这样做：


.abc{
显示器：flex；
弯曲方向：立柱；
}

2.
3.
1.
我知道你问过一个JavaScript解决方案，但是你也可以考虑看Frasbox。你可以这样做：


.abc{
显示器：flex；
弯曲方向：立柱；
}

2.
3.
1.
首先，您需要迭代每个
网格行
，然后对其
网格单元格
s进行排序“当我尝试使用jQuery执行此操作时，子div被排序到其他行中，”可能会显示此代码，以便我们可以帮助修复您尝试的内容，而不是从头开始。首先，您需要迭代每个
网格行
，然后对其
网格单元格
s进行排序“当我尝试使用jQuery执行此操作时，子div被排序到其他行中，”可能会显示此代码，以便我们可以帮助修复您尝试过的内容，而不是从头开始。
<pre>
    <div>
      <div class="abc grid-row">
        <div class="grid-cell position_2">
            <img src="#">
        </div>
        <div class="grid-cell position_1">
            <img src="#">
        </div>
      </div>
      <div class="abc grid-row">
        <div class="grid-cell position_2">
            <img src="#">
        </div>
        <div class="grid-cell position_3">
            <img src="#">
        </div>
        <div class="grid-cell position_1">
            <img src="#">
        </div>
      </div>
      <div class="def grid-row">
        <div class="grid-cell position_2">
            <img src="#">
        </div>
        <div class="grid-cell position_1">
            <img src="#">
        </div>
      </div>
    </div>
</pre>

$('.grid-row').each(function(){
    var $row = $(this), $cells = $();  //create an empty list
    for(var i=0; i<5; ++i){
        //append the items for each "position" to the list
        $.merge($cells, $row.find("> .grid-cell.position_"+i));
    }
    //append the cells in the right order to the row
    $row.append($cells);
})

//a utility to fetch the position
function getPosition(node){
    var m = node.className.match(/\bposition_(\d+)\b/);
    return +(m && m[1] || -Infinity);
}

$('.grid-row').each(function(){
    var $row = $(this);
    $row.find('> .grid-cell').sort(function(a, b){
        return getPosition(a) - getPosition(b);
    }).appendTo($row);
});