Question

如何使用jQuery将子元素附加到兄弟元素？

HTML

<div class="parent">
  <div class="child one">...</div>
  <div class="child">...</div>
  <div class="child">...</div>
</div>
<div class="parent">
  <div class="child one">...</div>
  <div class="child">...</div>
  <div class="child">...</div>
</div>

脚本

$('.child').each(function(i, obj){
  if(!$(obj).hasClass('one')){
    $(obj).appendTo( .. Stuck here .. '.one');
  }
});

我可以获得父对象，但麻烦就是选择类为'one'的孩子。

基本上我想移动所有兄弟姐妹，以便成为第一个孩子的孩子。

<div class="parent">
  <div class="child one">
    <div class="child">...</div>
    <div class="child">...</div>
  </div>
</div>
<div class="parent">
  <div class="child one">
    <div class="child">...</div>
    <div class="child">...</div>
  </div>
</div>

Answer 1

您想将所有child而非one追加到child one吗？

$('.child').not('.one').appendTo('.one');

<强> THE WORKING DEMO.

Answer 2

使用类one获取每个元素，然后使用类child附加其兄弟元素。

$('.child.one').each(function(i, obj){
  $(obj).siblings('.child').each(function(j, child){
    $(child).appendTo(obj);
  });
});

<强> Working Demo

注意：如果您希望child元素位于one元素之外，请将appendTo替换为after。

Answer 3

试试这个：

$('.child').each(function(){
 if(!$(this).hasClass('one')){
  $(this).appendTo('.one');
}});

<强> Working Demo

将子元素附加到同一父元素中的子元素

3 个答案: