代码之家 › 专栏 › 技术社区 › Klyner

如何用由除法类分隔的同一类对所有顺序元素进行分组?

siblings html jquery javascript

Klyner · 技术社区 · 6 年前

我有一个清单,由清单分隔符和项目组成。我想按字母顺序在列表分隔符下面订购项目。在我做这些之前,我需要把它们分组。问题是这些不是在 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>

有没有一种简单的方法可以将它们组合成一个数组?

1 回复 | 直到 6 年前

BStill 6 年前

我能想到的是:

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