如何将元素移动到另外一个元素？

我想将一个DIV元素移到另外一个元素中。 例如，我想移动它（包括全部孩子）：

<div id="source">
...
</div>

进入这个：

<div id="destination">
...
</div>

因此我有这个：

<div id="destination">
  <div id="source">
    ...
  </div>
</div>

---

#1楼

我刚用过：

$('#source').prependTo('#destination');

我从这里抓住了 。

---

#2楼

您可能想要使用appendTo函数（添加到元素的末尾）：

$("#source").appendTo("#destination");

或者你能够使用prependTo函数（它添加到元素的开头）：

$("#source").prependTo("#destination");

---

例：

$("#appendTo").click(function() { $("#moveMeIntoMain").appendTo($("#main")); }); $("#prependTo").click(function() { $("#moveMeIntoMain").prependTo($("#main")); });

#main { border: 2px solid blue; min-height: 100px; } .moveMeIntoMain { border: 1px solid red; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="main">main</div> <div id="moveMeIntoMain" class="moveMeIntoMain">move me to main</div> <button id="appendTo">appendTo main</button> <button id="prependTo">prependTo main</button>

---

#3楼

若是要放置元素的div包含内容，而且您但愿元素显示在主要内容以后：

$("#destination").append($("#source"));

若是要放置元素的div包含内容，而且要在主要内容以前显示元素：

$("#destination").prepend($("#source"));

若是要放置元素的div为空，或者您想要彻底替换它：

$("#element").html('<div id="source">...</div>');

---

若是要在上述任何一个以前复制元素：

$("#destination").append($("#source").clone());
// etc.

---

#4楼

您也能够尝试：

$("#destination").html($("#source"))

但这将彻底覆盖#destination任何内容。

---

#5楼

您能够使用：

要插入以后，

jQuery("#source").insertAfter("#destination");

要插入另外一个元素，

jQuery("#source").appendTo("#destination");