jQuery 在较小的列表中拆分长 ul 列表 [英] jQuery split long ul list in smaller lists

问题描述

我有一个很长的 UL 清单，我需要分解成较小的清单，每个清单包含大约 20 个项目.

I have a long UL list I need to break up in smaller lists containing about 20 items each.

我想我可以使用类似的东西

I was thinking I could use something like

$(function() {
    $("ul li:nth-child(20n)").after("</ul><ul>");
});

但事实并非如此.知道如何以使用最少 CPU 的方式使用 jQuery 吗?

but that's not the case. Any idea how to use jQuery in a way that uses minimal CPU?

推荐答案

我会用你删除的 li 创建文档片段，然后将它们重新附加到你想要的位置.在这种情况下，我将它们重新附加到正文中:

I would create document fragments with your removed lis and then reappend them to the location you want them. In this case, I reappended them to the body:

$(function(){
  var $bigList = $('#bigList'), group;
  while((group = $bigList.find('li:lt(20)').remove()).length){
    $('<ul/>').append(group).appendTo('body');
  }
});

现场演示位于:http://jsbin.com/ejigu/33

这篇关于jQuery 在较小的列表中拆分长 ul 列表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！