javascript - 如何将一个元素移动到另一个元素中?

我想将一个 DIV 元素移到另一个元素中。例如,我想移动这个(包括所有 child ):

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

进入这个:

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

所以我有这个:

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

最佳答案

您可能想使用 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>

https://stackoverflow.com/questions/1279957/

相关文章:

html - 如何为 'select' 框制作占位符?

html - 从 HTML 页面重定向

javascript - 我应该将 <script> 标签放在 HTML 标记中的什么位

html - RegEx 匹配除 XHTML 自包含标签之外的开放标签

javascript - 检索 HTML 元素的位置 (X,Y)

javascript - 在 jQuery 中创建一个 div 元素

php - 如何将 HTML 和 CSS 添加到 PDF 中

html - 如何设置 HTML