Javascript DOM樹重複操作

Question

由於頁面的DOM樹是活動的並且總是反映在瀏覽器中，因此爲了某種目的修改此DOM樹而不影響實際呈現樹的最佳方式是什麼？假設我的目的是交換某些子節點並查看DOM樹仍然保持相似程度。

創建複製樹是唯一的解決方案嗎？如果是這樣，是否有這樣的功能？或者我需要編寫自己的函數來創建樹的副本。我不需要元素對象的所有屬性，所以我可以創建一個更簡單的對象，並帶有一些指向兄弟和孩子的屬性。

Answer 1

您可以使用document.cloneNode(true)或其他節點上的相同方法。 cloneNode克隆任何節點，而true意味着它應該是遞歸的（深層）。顯然，這可能會在大頁面上產生顯着的性能成本。

Answer 2

也許可以考慮一個很好的JavaScript庫，例如， jQuery的。這些允許您輕鬆地複製文檔的某些部分甚至整個DOM，並從DOM中獲取存儲的appart。

如果您需要推出自己的解決方案，最好從一開始就是Resig在文檔片段上的文章：http://ejohn.org/blog/dom-documentfragments/。

祝你好運。

Answer 3

如果你願意使用jQuery：

var clone = $("selectorForSomeElement(s)").clone(); 

clone現在是要素結構的副本。

然後，您可以使用克隆來做任何您喜歡的試驗。