用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包裝東西

回答

相關問題