for循环与分割列表

时间:2015-04-09 11:03:34

标签: javascript for-loop

有78个项目列表:

<ul>
    <li> 1 </li>
    <li> 2 </li>
    .
    .
    .
    <li> 78 </li> 
</ul>

我想分成10-10块。

每个区块将有10个项目。

结果将是包含10个项目的7个街区和包含8个项目的第8个街区。

<ul>
    <li> 1 </li>
    <li> 2 </li>
    .
    .
    .
    <li> 10 </li>
</ul>

<ul>
    <li> 11 </li>
    <li> 12 </li>
    .
    .
    .
    <li> 20 </li>
</ul><br>
.<br>
.<br>
.<br>
<ul>
    <li> 71 </li>
    <li> 72 </li>
    .
    .
    .
    <li> 78 </li>
</ul>

建议逻辑

2 个答案:

答案 0 :(得分:1)

假设ul具有id list

var oldUL=document.getElementById('list');
var l = oldUL.children;
for(var i=0;i<l.length;i+=10){
 var newUL = document.createElement('ul');
 for(var s=0;s<10 && s<l.length;s++){
  newUL.appendChild(l[s]);
 }
 document.body.appendChild(newUl);
}
document.removeChild(oldUL)

答案 1 :(得分:0)

尝试自己的逻辑。 工作代码链接为here

$(document).ready(function(){   
var listHtml = $('#list ul').html(),
    listLength = $('#list ul li').length;

var _html = '',l = listLength, helpAgent = l, counter = 1,_newList='';

for(var i = 1 ; i <= Math.ceil(l/10) ; i++){         
    var lim = 10;       
    if(helpAgent == (l%10)){
        lim = helpAgent;
    }
    helpAgent -= 10;

    _newList += "<ul>";
    for(var j = 1 ; j <= lim ; j++){ 
        _newList += "<li>" + $($('#list ul li')[counter-1]).html() + "</li>";
        counter++;
    }  
    _newList += "</ul>";
}
$("#result").html(_newList);});

这适用于2位数限制(此处为78)我使用%10来获得2位数的余数。

相关问题