Javascript 如何在 DOM 中移动元素？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14088650/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to move an element in the DOM?
提问by user1031947
I have an element #superWidget in the DOM that is very interactive. It uses jquery UI sortable, draggable, and a bunch of other plugins.
我在 DOM 中有一个非常交互的元素 #superWidget。它使用 jquery UI 可排序、可拖动和一堆其他插件。
<div id="wrapperA"></div>
<div id="wrapperB">
<div id="superWidget"></div>
</div>
I want to change the position of #superWidget in the DOM. I want to remove it from #wrapperB and place it in #wrapperA.
我想改变#superWidget 在DOM 中的位置。我想从#wrapperB 中删除它并将它放在#wrapperA 中。
<div id="wrapperA">
<div id="superWidget"></div>
</div>
<div id="wrapperB"></div>
I have tried the following...
我尝试了以下...
var copy = $("#superWidget").clone(true, true);
$("#superWidget").remove();
$("#wrapperA").append(copy);
...however this breaks a lot of the plugins.
...然而，这破坏了很多插件。
I do not want to have to rebind everything. Is there a better way to do this? (I notice that jquery UI sortable is somehow able to move elements around in the DOM without breaking any interactivity... there must be a way.)
我不想重新绑定一切。有一个更好的方法吗？（我注意到 jquery UI sortable 能够以某种方式在 DOM 中移动元素而不会破坏任何交互性......必须有一种方法。）
Thanks (in advance) for your help
在此先感谢您的帮助
回答by Niet the Dark Absol
Rather than duplicating, just do this:
而不是复制，只需这样做：
document.getElementById('wrapperA').appendChild(document.getElementById('superWidget'));
