Javascript 如何使用JS、jQuery或D3在DOM中移动节点元素

全部：

我想知道如何使用JS、jQuery或D3在DOM中移动元素：

例如：

<div class="container"  style="width:100%;height:100%;">
    <div class="item" style="width:50%; height:40%; float:left;">DIV1</div>
    <div class="item" style="width:40%; height:40%; float:left;">DIV2</div>
    <div class="item" style="width:50%; height:40%; float:left;">DIV3</div>
    <div class="item" style="width:40%; height:40%; float:left;">DIV4</div>
</div>

第一组
第二组
第三组
第四组

所以现在显示的布局基本上是2X2，我想做的是拖动DIV1并移动到DIV4，然后它们可以交换位置。我有点想使用数组交换元素的方式，从DOM数组复制DIV1 DOM元素，将DIV4复制到该位置，然后将DIV1复制到该数组中的DIV4位置

但我不知道这是否可能，如果可能，如何实施

---

谢谢

请查看jqueryUI附加组件可拖动支持：

要让拖动事件更新后端，您需要将一个函数绑定到查询div结果顺序的容器的“stop”事件

这将涉及到向div添加一些行为，以便它们按照您想象的方式进行操作。任何未被拖动的div都需要知道何时尝试将另一个div拖放到页面上，其中对象（或鼠标指针）上的某个已定义句柄位于未被拖动的元素之前或之后

因此，一些伪代码：

onStop: function(item){ checkPointerLocation(); insertDraggedObjectBeforeNearest() }

---

是的，那当然有可能。@KevinB谢谢，还有……还有。。。我不会为您编写代码。@KevinB好的，谢谢。您介意删除jquery标志吗。这与jQuery无关。我试过了，但仍然无法理解2D拖动和交换。你知道像我提到的问题一样的教程或例子吗，从第1部分到第4部分？我不知道这方面的具体教程。我认为这不仅仅是拖放操作，也不太复杂。我在上面补充了一些建议。