日期:2014-05-16  浏览次数:20369 次

依然是js问题,js给li添加父级元素 如何循环下
代码    执行以下代码 后 应该是 会给  每3个 <li> 加上父级元素   <div class="fenzu"> 


<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>test</title>
    <script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.8.3/jquery.min.js"></script>
</head>
<body>
<div class="main">
    <li> 内容</li>
    <li> 内容</li>
    <li> 内容</li>
    <li> 内容</li>
    <li> 内容</li>
    <li> 内容</li>
    <li> 内容</li>
    <li> 内容</li>
    <li> 内容</li>
    <li> 内容</li>
</div>

<script type="text/javascript">
    var li = $('.main li');
 
    for(var i = 0; i < li.length; i += 3){
        li.slice(i, i + 3).wrapAll('<div class="fenzhu"></div>');
    }
</script>
</body>
</html>




但是如果有  多个<div class="main"> 的话 就会出现  每个 mian 里li的数量 不对   我觉得是因为  var li = $('.main li'); 这句获取的是页面中所有的 li,   怎么可以循环下?


<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>test</title>
    <script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.8.3/jquery.min.js"></script>
</head>
<body>
<div class="main">
    <li> 内容</li>
    <li> 内容</li>
    <li> 内容</li>
    <li> 内容</li>
    <li> 内容</li>
……若干个li
    <li> 内容</li>
   
</div>

<div class="main">
    <li> 内容</li>
    <li> 内容</li>
    <li> 内容</li>
    <li> 内容</li>
    <li> 内容</li>
……若干个li
    <li> 内容</li>
   
</div>

<div class="main">
    <li> 内容</li>
    <li> 内容</li>
    <li> 内容</li>
    <li> 内容</li>
    <li> 内容</li>
……若干个li
    <li> 内容</li>
   
</div>

<script type="text/javascript">
  &nb