Question

如何在2（或更多）div附近添加div元素？我的想法：

$('div.list-price').each(function() {
  $(this).before('<div class="action-price">');
  $(this).next().after('</div>');
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="list-price">20000</div>
<div class="sell-price">10000</div>

我希望上面的代码可以做到这一点：

<div class="action-price">
  <div class="list-price">20000</div>
  <div class="sell-price">10000</div>
</div>

可是：

<div class="action-price"></div>
<div class="list-price">20000</div>
<div class="sell-price">10000</div>

有人能帮助我吗？

Answer 1

尝试使用wrapAll函数：

$('.list-price, .sell-price').wrapAll('<div class="action-price" />');

Answer 2

您将元素视为HTML代码，但它们是对象。您不能单独添加起始和结束标记，因为它们不是完整的元素。

添加新元素，并移动其中的现有div：

$('div.list-price').each(function() {
  var newDiv = $('<div/>').addClass('action-price');
  $(this).before(newDiv);
  var next = $(this).next();
  newDiv.append(this).append(next);
});

演示：http://jsfiddle.net/Guffa/eFXbN/1/

Answer 3

一个很好的方法是执行以下操作。

$("div.list-price").each(function(){
     $(this).nextUntil("div.list-price").andSelf().wrapAll("<div class='action-price'></div>");
});

它简单易读，可能就像jQuery开发人员想要的那样。

Answer 4

$first = ... // the 1st element
$rest = ... // other elements, may be just the second one
$first.wrap('<div class="wrapper"/>').parent().append($rest)

Answer 5

我不得不将你的最后一行改为：

。

$ rest.wrap（ ''）的父（）追加（$第一）;

使用jQuery创建两个其他div的包装器div

5 个答案: