javascript - 操作 "imaginary"元素是否比当前在 DOM 中的元素更快？

Question

假设我正在使用 jQuery 循环遍历现有网页元素并对其执行一些操作。有很多变化，集合中的元素数量至少有些多，元素结构有些复杂。

假设我将所有元素放入同一个 jQuery 对象中，使用 jQuery 的 .clone(或 .detach)方法创建一个要处理的“假想”副本，删除当前元素，然后重新插入是否会更快更改后的副本到 DOM 中？

...或者这没有什么区别——因为动态 DOM 元素的操作速度与非 DOM 元素一样快？

Answer 1

是，实际上，尽管您的里程可能会有所不同。

当元素可见时，操作将导致浏览器重绘页面。许多重绘加起来会严重影响性能。

当元素不可见时，不会触发重绘。

大量元素克隆的成本可能相当高，因此我会尽可能避免这样做。