Question

我在dom中移动div时有点迷失。我基本上需要改变一些div的顺序。我应该删除它，然后以某种方式重新插入它，或者有更好的方法在dom树中移动它。

感谢您的任何见解。

Answer 1

如果您只需要移动它，并且不需要使用JavaScript对元素进行任何回流触发更改，只需使用appendChild()。

另一方面，如果您需要对元素进行更改，更新其属性或触发文档重排的“物理”维度，则值得将其从进行更改的DOM中删除，然后重新插入{ {1}}或appendChild()。

请记住，已经有一个文档重排，只需重新定位元素，但是如果要进行任何其他更改，那么在重新插入之前尝试使用元素/节点作为documentFragment在幕后执行它们

参考文献：

appendChild()。
insertBefore()。

Answer 2

您无需删除它，您可以使用appendChild或insertBefore或jQuery方法（例如insertAfter等）重新定位节点。

例如：

var newOrder = ['id2', 'id1', 'id4', 'id3'];
var container = document.getElementById('container');

for(var i = 0, l=newOrder.length; i<l; i++) {
    container.appendChild(document.getElementById(newOrder[i]));
}

这会将带有id*的节点移动到容器的末尾，但按照newOrder中定义的顺序

在dom中移动div的最快方法是什么？

2 个答案: