如何将所有按顺序排列的具有相同 class 且由分隔符 class 分隔的元素分组？

Question

我有一个由列表分隔符和项目组成的列表。我想按字母顺序逐个排序列表分隔符下的项目。在执行此操作之前，我需要将它们分组。问题是那些没有在 div 内排列，但它们处于同一级别。我已经尝试了很多但无法找到如何将它们分组到一个数组中以便我能够遍历这些组。

我的html结构如下：

<div class="list">
 <div class="list-divider">A list divider</div>
 <div class="element">A</div>
 <div class="element">B</div>
 <div class="list-divider">A list divider</div>
 <div class="element">G</div>
 <div class="element">A</div>
 <div class="element">C</div>
 <div class="element">B</div>
 <div class="list-divider">A list divider</div>
 <div class="element">A</div>
 <div class="element">X</div>
 <div class="element">X</div>
 <div class="element">C</div>
</div>

有没有简单的方法将它们分组到一个数组中？

Answer 1

这是我能想到的：

var sortable = [];
var newHTML = "";

$(".list > div").each(function(key, value) {
  if (value.className == "list-divider"){
   sortable.push([]);
  }
  else {
   sortable[sortable.length-1].push(value);
  }
})
for (i in sortable)
{
  sortable[i].sort(function(a,b) {return (a.innerHTML > b.innerHTML) ? 1 : ((b.innerHTML > a.innerHTML) ? -1 : 0);} );
}
$(".list > .list-divider").each(function(key, value) {
  newHTML += value.outerHTML;
  for (i in sortable[key])
   newHTML += sortable[key][i].outerHTML;
})
$(".list").html(newHTML)

Here is a link to my code

如何将所有按顺序排列的具有相同 class 且由分隔符 class 分隔的元素分组？

How to group all sequently ordered elements with the same class seperated by divider classes?

html

javascript

jquery

siblings