Question

目前我有这样的事情：

  <body>
    <div class="one"></div>
    <div class="two"></div>
    <div class="three"></div>
  </body>

我需要使用jquery创建一个新的<div class="four">，其中包含两个现有的div。

最终结果应为：

  <body>
    <div class="four">
      <div class="one"></div>
      <div class="two></div>
    </div>
    <div class="three"></div>
  </div>

我尝试了一些功能，但我无法做到。谢谢！

Answer 1

只需选择子elemnets并使用wrapAll jQuery函数创建父元素。

以下是一个例子：

＆＃13;

$('.child').wrapAll("<div class='four' />");

＆＃13;

.four {
  border: 1px solid black;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
  <div class="child one">One</div>
  <div class="child two">Two</div>
  <div class="child three">Three</div>
</body>

＆＃13;

Answer 2

这就是我的所作所为，感谢您的建议：

  $(document).ready(function() {
    $(".one, .two").wrapAll("<div class='four'></div>");
  })

.four {
 background-color: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
    <div class="one">1</div>
    <div class="two">2</div>
    <div class="three">3</div>
  </body>

创建新div并插入exisintg元素

2 个答案: