用 div 包裹所有元素答案

【问题标题】：wrap all elements with div用 div 包裹所有元素
【发布时间】：2018-01-16 19:05:27
【问题描述】：

我一直在这个网站上，但没有找到我的答案。我正在尝试将所有 div 包装到一个包装器中。到目前为止，我使用 wrapAll 所能做的就是在每个 div 周围添加一个容器。我不想那样做。我有这个

 <div class="container-fluid">
     <div class="panel-cell">Content</div>
     <div class="panel-cell">Content</div>
     <div class="panel-cell">Content</div>
     <div class="panel-cell">Content</div>
 </div><!--END container-fluid-->

我需要把它变成这个

 <div class="container-fluid">
     <div class="container">
         <div class="panel-cell">Content</div>
         <div class="panel-cell">Content</div>
         <div class="panel-cell">Content</div>
         <div class="panel-cell">Content</div>
     </div><!--END container-->
 </div><!--END container-fluid-->

这可能与Jquery有关吗？

【问题讨论】：

Use jQuery to wrap all elements in a div的可能重复
这不是重复的。如果您阅读了我正在尝试做的事情，那么它与其他帖子不同。他正在尝试分离 div。我想把它们都包起来。

标签： jquery html wrapall

【解决方案1】：

jquery 中的 .wrapAll API 会这样做

$(".panel-cell").wrapAll("<div class='container'></div>");

【讨论】：

它正在工作，但不是它的预期方式。我正在使用带有页面构建器的 wordpress。当我尝试这段代码时，它会获取页面上的每个元素并将其包装到同一个 div 中。所以，我想也许它正在按预期的方式工作。我需要想办法让它只适用于单个行。
为特定容器提供 id 并运行

【解决方案2】：

您可以使用此代码

var html = $(".container-fluid").html()
var temp = "<div class='container'>"+html+"</div>"
$(".container-fluid").html(temp)

【讨论】：

我试过但没用。好吧，它确实做到了，但我不能在容器流体上做到这一点，因为它破坏了我想要做的事情。我尝试修改您的版本，但出现错误。

【解决方案3】：

这里有一个解决方案https://jsfiddle.net/woLzgvok/

$(".panel-cell").wrapAll("&lt;div class='container'&gt;&lt;/div&gt;");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="container-fluid">
     <div class="panel-cell">Content</div>
     <div class="panel-cell">Content</div>
     <div class="panel-cell">Content</div>
     <div class="panel-cell">Content</div>
 </div><!--END container-fluid-->

WrapAll Documentation

【讨论】：