如何移动 DOM 中的元素？答案

【问题标题】：How to move an element in the DOM?如何移动 DOM 中的元素？
【发布时间】：2012-12-30 05:53:08
【问题描述】：

我在 DOM 中有一个非常互动的元素 #superWidget。它使用 jquery UI 可排序、可拖动和一堆其他插件。

<div id="wrapperA"></div>
<div id="wrapperB">
  <div id="superWidget"></div>
</div>

我想改变#superWidget 在DOM 中的位置。我想将其从#wrapperB 中删除并将其放在#wrapperA 中。

<div id="wrapperA">
  <div id="superWidget"></div>
</div>
<div id="wrapperB"></div>

我已经尝试了以下...

var copy = $("#superWidget").clone(true, true);
$("#superWidget").remove();
$("#wrapperA").append(copy);

...但是这破坏了很多插件。

我不想重新绑定所有内容。有一个更好的方法吗？（我注意到 jquery UI sortable 能够以某种方式在 DOM 中移动元素而不会破坏任何交互性......必须有一种方法。）

感谢（提前）您的帮助

【问题讨论】：

【解决方案1】：

与其重复，不如这样做：

document.getElementById('wrapperA').appendChild(document.getElementById('superWidget'));

【讨论】：