2016-07-08 3 views
-1

Я хочу поставить div в другой div, используя js. Я нашел решение, которое может сделать это, но просто поместите 1 div в div. Ниже html - моя ситуация.положить несколько div и еще один div div

Например:

<body> 
    <div> 
     <span class="outer_part"> 
     </span> 
     <div class="inner_part">1 
     </div> 
    </div> 
    <div> 
     <span class="outer_part"> 
     </span> 
     <div class="inner_part">2 
     </div> 
    </div> 
    <div> 
     <span class="outer_part"> 
     </span> 
     <div class="inner_part">3 
     </div> 
    </div> 
</body> 

Результат:

<body> 
    <div> 
     <span class="outer_part"> 
      <div class="inner_part">1</div> 
     </span> 
    </div> 
    <div> 
     <span class="outer_part"> 
      <div class="inner_part">2</div> 
     </span> 
    </div> 
    <div> 
     <span class="outer_part"> 
      <div class="inner_part">3</div> 
     </span> 
    </div> 
</body> 

Я нашел решение, но не работает

<script> 
    $('.inner_part').appendTo('span.outer_part'); 
</script> 
+0

Какой ваш желаемый результат? –

ответ

0

Ваша проблема заключается в том, что вы добавив все .inner_part элементы ко всем .outer_part элементов, но вам нужно только сделать часть этого.

Вы можете использовать each() чтобы перебрать все.inner_parts, и приложить друг к предыдущему собрату, который является .outer_part.

// loop over all inner parts 
$('.inner_part').each(function() { 

    var innerPart = $(this); 
    var outerPart = innerPart.prev(); // inner part's previous sibling is the outer part 

    innerPart.appendTo(outerPart); 
}); 

Или, короче:

$('.inner_part').each(function() { 
    $(this).appendTo($(this).prev()); 
}); 
0

Получить элемент по идентификатору, а затем добавить HTML внутри него, чтобы добавить DIV в этом случае или все, что вы хотите.

document.getElementById('div1').innerHTML += '<div class="inner_part">1</div>';
<div id="div1"></div>

Смежные вопросы