将十个列表项的元素组合到JQuery中

Posted 2021-02-26

Quick and dirty but it does the job.

<ul>
<li class="child">one</li>
<li class="child">two</li>
<li class="child">three</li>
<li class="child">four</li>
<li class="child">five</li>
<li class="child">six</li>
<li class="child">seven</li>
<li class="child">eight</li>
<li class="child">nine</li>
<li class="child">ten</li>
<li class="child">eleven</li>
<li class="child">twelve</li>
<li class="child">thirteen</li>
<li class="child">fourteen</li>
<li class="child">fifteen</li>
<li class="child">sixteen</li>
<li class="child">seventeen</li>
<li class="child">eightteen</li>
<li class="child">nineteen</li>
<li class="child">twenty</li>
</ul>
 
$(document).ready(function() {
   $("#announcements ul").find("li:nth-child(10n+3)").removeClass("child").addClass("parent");
 
  var $everything = $('.parent,.child');
  var splitAtHeaders = [];
 
  $everything.each(function(index){
    var $item = $(this);
    if ('parent'===$item.attr('className') || !splitAtHeaders.length) {
      splitAtHeaders[splitAtHeaders.length] = [];
    }
    splitAtHeaders[splitAtHeaders.length-1].push($item);
  });
 
  $.each(splitAtHeaders, function(){
    var currentWrapper = null;
    $.each(this, function(index){
      if (0===index || !currentWrapper) {
        currentWrapper = this.wrap('<ul class="ul_wrap"></ul>');
				$(this).before("10");
      }
      else {
        currentWrapper.append(this);
      }
    });
  });
	 });