如何通過javascript或jQuery更改元素在另一個元素中的位置？

Question

我想更改一個元素在另一個元素中的位置

這就是我所擁有的：

<div class="post-cont">
 <div class="post-thumail">
 </div>
<article>
  <div class="post-home">
    <div class="post-info">
     <div class="post-cont">
     </div>
    </div>
  </div>
</article>

我想在class post-thumail的div之前更改class post-cont的div的post-thumail

像這樣 ：

<div class="post-cont">
 <div class="post-cont">
 </div>
 <div class="post-thumail">
 </div>
<article>
  <div class="post-home">
    <div class="post-info">
    </div>
  </div>
</article>

我使用了before（）和append（）jQuery專有函數，它們對我不起作用

Answer 1

您可以使用.insertBefore() ：

$('article .post-cont').insertBefore($('.post-thumail'));

工作演示

注意：您已encorrect關閉標簽的article 。 應該是</article> 。 還請確保關閉主div。

Answer 2

使用此代碼...

 $('article .post-cont').insertBefore($('.post-thumail')); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="post-cont"> <div class="post-thumail"> 1st </div> <article> <div class="post-home"> <div class="post-info"> <div class="post-cont"> 2nd </div> </div> </div> </articale>