我的UL清单很长，我需要分解成较小的清单，每个清单包含约20个项目。我以为我可以使用类似$(function() { $("ul li:nth-child(20n)").after("</ul><ul>");});但事实并非如此。知道如何以最少的CPU使用jQuery吗？
3 回答
红糖糍粑
TA贡献1815条经验 获得超6个赞
不幸的是，没有那么简单（至少我知道）。尝试以下方法：
$(function() {
$("ul").each(function() {
var list = $(this);
var size = 3;
var current_size = 0;
list.children().each(function() {
console.log(current_size + ": " + $(this).text());
if (++current_size > size) {
var new_list = $("<ul></ul>").insertAfter(list);
list = new_list;
current_size = 1;
}
list.append(this);
});
});
});
毫无疑问，您可以将其转换为以块大小作为参数的函数，但我将其作为练习留给读者。
慕的地8271018
TA贡献1796条经验 获得超4个赞
这是一个工作示例，只需将mod 5更改为mod 20。
<html>
<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript">
function onLoad(){
var itemindex = 0;
var Jlistobj = null;
$('#list li').each(function()
{
if (itemindex % 5 == 0)
{
Jlistobj = $("<ul></ul>");
}
Jlistobj.append($(this));
$('#out_div').append(Jlistobj);
itemindex++;
});
}
</script>
<body onLoad="onLoad()">
<ul id="list">
<li>item1</li>
<li>item2</li>
<li>item3</li>
<li>item4</li>
<li>item5</li>
<li>item6</li>
<li>item7</li>
<li>item8</li>
<li>item9</li>
<li>item10</li>
<li>item11</li>
<li>item12</li>
<li>item13</li>
<li>item14</li>
<li>item15</li>
<li>item16</li>
<li>item17</li>
<li>item18</li>
<li>item19</li>
<li>item20</li>
</ul>
<div id="out_div"></div>
</body>
</html>
- 3 回答
- 0 关注
- 501 浏览
相关问题推荐
添加回答
举报
0/150
提交
取消