jQuery - 在一个div之后和另一个div之前包装元素

Question

我有这个html代码

<div class="sbox">
<div class="top-sbox"></div>
<h3>Menu</h3>
    <ul class="subpages">
    <li><a href="#">Subpagina</a></li>
    <li><a href="#">Subpagina</a></li>
    <li><a href="#">Subpagina</a></li>
    <li><a href="#">Subpagina</a></li>
    <li><a href="#">Subpagina</a></li>
    <li><a href="#" class="last">Subpagina</a></li>
    </ul>


<div class="bottom-sbox"></div>
</div>

我该如何将 div.top-sbox 后以及 div.bottom-sbox 前的所有元素包裹起来？

谢谢！

我想要的结果是：

<div class="sbox">
<div class="top-sbox"></div>
<div id="wrapper">
<h3>Menu</h3>
    <ul class="subpages">
    <li><a href="#">Subpagina</a></li>
    <li><a href="#">Subpagina</a></li>
    <li><a href="#">Subpagina</a></li>
    <li><a href="#">Subpagina</a></li>
    <li><a href="#">Subpagina</a></li>
    <li><a href="#" class="last">Subpagina</a></li>
    </ul>
</div>  
<div class="bottom-sbox"></div>
</div>

- Adrian Florescu

---

包裹它们在什么里？你具体是什么意思？因为有很多种方法可以做到这一点 =D - eyaka1

将其包装在一个div或任何元素中。我编辑了我的问题！ - Adrian Florescu

Answer 1

给你，这是答案。

编辑：抱歉。更简单的方法：http://jsfiddle.net/ajRd2/1/

$('.top-sbox').nextUntil('.bottom-sbox').wrapAll('<div class="dwrap" />'); 

- wesbos

---

+1 nextUntil 是 jQuery 1.4 中的一个不错的增强功能。回答得好。 - Erick Petrucelli

谢谢！我之前不知道.nextUntil，好酷！我还添加了这个代码：$('.top-sbox').each(function() ，以使其在更多div上运行得更顺畅！ - Adrian Florescu

Answer 2

尝试一个简单的代码： $('.top-sbox').after('<div>'); $('.bottom-sbox').after('</div>'); 是的，上面的答案更好，使用它 =)

- eyaka1

---

最好的做法是将一个 div 注入到 DOM 中，而不是将文本添加到标记中两次。 - wesbos