5

我试图在 div 中包装一系列子元素,以便分组操作它们;试图将每个组定位在不同的位置。场景是我有一个随机生成li标签的列表,无论出现多少标签,我都需要单独操作每组十个标签。

为了弄清楚这一点,我使用了一个书面清单:

$("ul li ul li:nth-child(n+11)").wrapAll("<span class='shift' />");
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="access">
  <div class="menu">
    <ul>
      <li>
        <p>Hello</p>
        <ul>
          <li>Stuff</li>
          <li>Stuff</li>
          <li>Stuff</li>
          <li>Stuff</li>
          <li>Stuff</li>
          <li>Stuff</li>
          <li>Stuff</li>
          <li>Stuff</li>
          <li>Stuff</li>
          <li>Stuff</li>
          <li>Stuff2</li>
          <li>Stuff2</li>
          <li>Stuff2</li>
          <li>Stuff2</li>
          <li>Stuff2</li>
          <li>Stuff2</li>
          <li>Stuff2</li>
          <li>Stuff2</li>
          <li>Stuff2</li>
          <li>Stuff2</li>
          <li>Stuff3</li>
          <li>Stuff3</li>
          <li>Stuff3</li>
          <li>Stuff3</li>
          <li>Stuff3</li>
          <li>Stuff3</li>
          <li>Stuff3</li>
          <li>Stuff3</li>
          <li>Stuff3</li>
          <li>Stuff3</li>

        </ul>
      </li>
    </ul>
  </div>
</div>

但这当然不是我需要的。

这是我现在正在处理的代码。

var count = $("ul li ul li").length;
for(var c = 11; c<=count;c+=10){
$("ul li ul li:nth-child(n+"+c+")").wrapAll("<span class='shift' />");
}

这种工作,但它创建了班次类的嵌套实例。

我需要单独的包装 div。如果我要编写代码,它将是:

 $("ul li ul li:nth-child("+c+"<n<"+(c+10)+")").wrapAll("<span class='shift' />");

但显然那是行不通的。其他人以前做过这样的事情。搜索了一下没有成功。

4

2 回答 2

9

您可以尝试.slice方法:

// note: different from nth-child, slice is 0-based position
$("ul li ul li").slice(c, c+10).wrapAll("<span class='shift' />");
于 2012-07-10T03:21:10.137 回答
2
var i=0;
$(".menu ul ul li:first-child").before("<div>");
$(".menu ul ul li").each(function(){
    i++;
    if(i % 10==0){
        $(this).after('</div><div>')
    }
});
$(".menu ul ul li:last-child").after("</div>");
于 2012-07-10T03:22:46.063 回答