在 jQuery 中用兄弟姐妹包装 div 的最简单方法是什么？答案

【问题标题】：What is the simplest way to wrap a div with siblings in jQuery?在 jQuery 中用兄弟姐妹包装 div 的最简单方法是什么？
【发布时间】：2010-10-22 04:16:29
【问题描述】：

我想使用 jQuery 动态扩展我的标记，以便我的 div 显示为漂亮的圆角框。

例如，如果我的 DOM 有一系列具有唯一 ID 的 div 对象，例如：

<div id="queuediv0" class="isequeue" > </div>

可以通过以下方式选择：

$(“.isequeue”)

我想替换/包装这些 div，以便最终结果如下所示：

<div class="isequeue_wrapper">
    <div class="isequeue_wrapper_oc">
        <div class="isequeue_wrapper_dk" style="margin: 0 5px;"> </div>
        <div class="isequeue_wrapper_dk" style="margin: 0 3px;"> </div>
        <div class="isequeue_wrapper_dk" style="margin: 0 2px;"> </div>
        <div class="isequeue_wrapper_dk" style="margin: 0 1px;"> </div>
   </div>
    <p class="isequeue_header">
        Header text
    </p>
    <div class="isequeue_wrapper_ic">
        <div class="isequeue_wrapper_lt" style="margin: 0 5px;"> </div>
        <div class="isequeue_wrapper_lt" style="margin: 0 3px;"> </div>
        <div class="isequeue_wrapper_lt" style="margin: 0 2px;"> </div>
        <div class="isequeue_wrapper_lt" style="margin: 0 1px;"> </div>
    </div>
    <div id="queuediv0" class="isequeue" >
    </div>
     <div class="isequeue_wrapper_oc">
         <div class="isequeue_wrapper_dk" style="margin: 0 1px;"> </div>
         <div class="isequeue_wrapper_dk" style="margin: 0 2px;"> </div>
         <div class="isequeue_wrapper_dk" style="margin: 0 3px;"> </div>
         <div class="isequeue_wrapper_dk" style="margin: 0 5px;"> </div>
     </div>
</div>

可以即时添加附加标记，也可以将其隐藏在原始页面中，以便可以选择和复制。

我确信有一种干净的方法可以实现这一点，但现在我还没有找到它。 jQuery.wrap() 会将选中的对象放到提供的源的最里面，但是当你希望选中的项目是新添加的源的兄弟时，你如何做到这一点。

谢谢，吉姆

【问题讨论】：

标签： javascript jquery css

【解决方案1】：

before() 和 after() 应该可以工作。

【讨论】：

【解决方案2】：

这样的事情可能会奏效：

$(function() {
    var $isqueue = $('.isequeue');
    $isqueue.wrap('<div class="isequeue_wrapper"></div>');
    $isqueue.before(/* All the isequeue_wrapper_oc, isequeue_header, isequeue_wrapper_ic and  stuff */).after(/* All the isequeue_wrapper_ic stuff */);
});

将所有东西预先制作好然后克隆它是明智的。但是，您也可以将它们作为字符串并以相同的方式插入。

【讨论】：