jQuery：將整個元素移動到另一個元素中，但不移動它的內容

有源DIV元素必須出現在目標DIV中。jQuery：將整個元素移動到另一個元素中，但不移動它的內容

有jQuery appendTo方法，似乎這樣做對我來說。

例如：

<div class="source">Move Me</div> 
<div class="destination"></div> 

jQuery(document).ready(function(){ 
    jQuery('.source').contents().appendTo('.destination') 
    });

但實際上它只是將源的內容到目標DIV，保持空源DIV它最初是：這裏是一個演示這個JSFiddle。

所以，與其

<div class="destination"> 
    <div class="source">Move Me</div> 
</div>

的appendTo結果卻

<div class="source"></div> 
<div class="destination">Move Me</div>

有沒有辦法實現

<div class="destination"> 
    <div class="source">Move Me</div> 
</div>

而無需額外的包裝元素？

來源

2017-02-28 YKKY

'的jQuery（ '源 '）。appendTo（' 目標'）' –

你重新調用'.contents（）'，這樣只有移動......等待它......內容。 – nnnnnn

我已經採取了我在頁面的其他片段使用的腳本，既沒有填充JSFiddle，也沒有創建這個問題，我沒有注意到'.contents（）'在我的文本！這可能是因爲它是早上5點半。無論如何，這很難成爲初學者...... @MichaelCoker，你是第一個，請重新發布你的答案作爲答案，以便我可以upvote它。非常感謝你們倆:) – YKKY

$.contents()將抓住元素的內容，但離開元素本身。 $.append()和$.appendTo()的默認行爲是移動整個元素。所以，在你的榜樣，你只需要使用jQuery('.source').appendTo('.destination')，這將在移動.source到.destination

jQuery('.source').appendTo('.destination')

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="source">Move Me</div> 
 
<div class="destination"></div>

來源

2017-02-28 04:14:50

剛剛擺脫那個.contents（）方法來移動整個元素。

$('.destination').append($('.source'))

會變成

<div class="destination"></div> 
<div class="source">Move Me</div>

到

<div class="destination"> 
    <div class="source">Move Me</div> 
</div>

來源

2017-02-28 02:40:33

首先all.The jQuery的appendTo行爲的一個元素到另一個元素後追加。所以這種行爲是正確的。也可能需要append方法。

來源

2017-02-28 02:51:51

在自己的解決方案簡單地排除.contents()，這種方式：

jQuery(document).ready(function(){ 
    jQuery('.source').appendTo('.destination') 
});

然後，它會完全移動Div.source到Div.destination。這裏是小提琴：https://jsfiddle.net/NDFA/cur9qg2w/

來源

2017-02-28 03:16:47 NDFA

jQuery：將整個元素移動到另一個元素中，但不移動它的內容

回答

相關問題