如何使用jQuery將元素從內部移動到外部？

Question

我試圖將錨點標記移動到p元素之外，目前它位於p元素之內。這裏是我的html：

<div class="the_excerpt"> 
    <p> 
     <a href="#">Learn More</a> 
    </p> 
</div> 

我已經試過append()功能，但它不能正常工作。我不想插入新的錨點元素。我只是想要移動p元素外的錨元素。

$('.the_excerpt').find('p').append($('.the_excerpt').find('a')); 

任何一個可以請指導我如何解決，我會很高興。謝謝

Answer 1

您試圖追加p標籤，因爲a在p之內，所以不會對標記進行任何更改。因此，改變你的代碼如下

$('.the_excerpt').append($('.the_excerpt p a'));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div class="the_excerpt"> 
 
    <p> 
 
     <a href="#">Learn More</a> 
 
    </p> 
 
</div>

---

或者你需要使用appendTo()

$('.the_excerpt p a').appendTo('.the_excerpt');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div class="the_excerpt"> 
 
    <p> 
 
     <a href="#">Learn More</a> 
 
    </p> 
 
</div>

Answer 2

$('a').unwrap();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div class="the_excerpt"> 
 
    <p> 
 
     <a href="#">Learn More</a> 
 
    </p> 
 
</div>

你可以嘗試使用.unwrap()

說明：刪除集從DOM匹配的元素的父母，離開自己的位置匹配的元素。

Answer 3

使用appendTo()。

$('.the_excerpt').find('p a').appendTo($('.the_excerpt')); 

FIDDLE DEMO

Answer 4

//克隆元件，如果需要

變種cloneEle = $（ 'the_excerpt。 '）找到（' A'）除去的clone（）除去（）。;

//追加在那裏你想要克隆的元素

$（ 「.the_excerpt」）。經過（cloneEle）; //如果你想.the_excerpt後aapend

或

$（ 「.the_excerpt」）.append（cloneEle）; //如果外面只有p標籤