Question

我有一个这样的清单：

<li rel="2001" class="project">...</li>
<li rel="2001" class="project">...</li>
<li rel="2001" class="project">...</li>
...
<li rel="2007" class="project">...</li>
<li rel="2007" class="project">...</li>
<li rel="2007" class="project">...</li>
...
<li rel="2011" class="project">...</li>
<li rel="2011" class="project">...</li>
<li rel="2011" class="project">...</li>

等等（正如你猜测的那样）。现在，我想在年份基础上抓住每一个并将其分组为：

<ul id="2011">
    <li class="year">2011</li>
    <li rel="2011" class="project">...</li>
    <li rel="2011" class="project">...</li>
    <li rel="2011" class="project">...</li>

<ul id="2017">
    <li class="year">2017</li>
    <li rel="2017" class="project">...</li>
    <li rel="2017" class="project">...</li>
    <li rel="2017" class="project">...</li>

... and so on...

基本上：取每个li.project并获取他的attr（'rel'）的值，然后将它们（group（myYear））分组到数组中，并用attr（id，'myYear'）包装每个数组和添加另一个HTML（

是的，需要帮助:)）

谢谢你！

Answer 1

$("li").each(function(){
var x = "ul#" + $(this).attr("rel"); //the ul with id ID of the LI's rel
if($(x).length > 0) //if ul with that year exist
$(x).append($(this));
else{
$(x).appendTo("body");  //create ul and append to body
$(x).append("<li class='year'>");// append the first li
}
});

Answer 2

查看这种方法。它减少了插入次数，从而减少了对DOM的压力。

http://jsfiddle.net/huGry/

现在，用纯JS做吧;）

抓住具有相同attr的元素并制作组

2 个答案: