用jQuery包装东西

我需要在包装div/span中获取一些列表元素。这是它的现在：用jQuery包装东西

<ul> 
<li>One</li> 
<li>Two</li> 
<li>Three</li> 
<li>Four</li> 
<li>Five</li> 
<li>Six</li> 
</ul>

我需要的是这样的：

<ul> 
<div class="wrapper"> 
<li>One</li> 
<li>Two</li> 
</div><div class="wrapper"> 
<li>Three</li> 
<li>Four</li> 
</div><div class="wrapper"> 
<li>Five</li> 
<li>Six</li> 
<div class="wrapper"> 
</ul>

或者可以像财产以后跨度。没有关系。我需要在每三个元素之后换行。

来源

2010-11-17 pekkass

这不是有效的HTML - “li”列表项是'ul'无序列表可以包含的唯一东西。如果您需要多栏列表，您是否考虑过使用浮动或CSS3列？ – 2010-11-17 06:10:53

您所期望的输出不是有效的HTML。不建议在您的网页中使用此类HTML – 2010-11-17 06:12:48

这不是有效的HTML，这是错误的做到这一点 - 你不能插入内部列表格，但我会给以供将来参考捆绑的语法jQuery中：

$("JQUERYSELECTOR").wrap("<div class='wrapper'></div>");

的JQUERYSELECTOR应该是什么元素，你想换行即

#ul:nth-child(1)

为列表的第一个孩子。

但是，再次，包装div列表项是错误的。

来源

2010-11-17 06:33:16

可以遍历您的元素，并使用.slice()和.wrapAll()，这样包起来：

var lis = $("ul li"); 
for(var i = 0; i < lis.length; i+=3) { 
    lis.slice(i, i+3).wrapAll('<li class="wrapper"><ul></ul></li>'); 
}

既然你说了些什么像一个<div>/<span>这将做的工作，并给你有效的HTML ，像这样：

<ul> 
    <li class="wrapper"> 
    <ul> 
     <li>One</li> 
     <li>Two</li> 
     <li>Three</li> 
    </ul> 
    </li> 
    <li class="wrapper"> 
    <ul> 
     <li>Four</li> 
     <li>Five</li> 
     <li>Six</li> 
    </ul> 
    </li> 
</ul>

你举的例子表明，每2元，但你的问题文中说，每3 ...我只是挑3在这里，只是adjus t函数中的数字，并且您已全部设置。

来源

2010-11-17 10:20:37

用jQuery包装东西

回答

相关问题