Replace whole DOM in javascript

Question

I need to implement undo-redo functionality in my project. But it is very complex and every change affects on many elements. I think saving and restoring whole page will be the best choice. But i have some problems with missing .data() params of DOM elements. I use next functions:

// save
var documentCopy = document.documentElement.cloneNode(true);

// restore
document.replaceChild(
documentCopy,
document.documentElement
);

How I can save and restore whole DOM with saving jQuery.data() of elements?

Answer 1

The trivial thing that I would try is using jQuery's clone instead. Be sure to use it with two true parameters, but be careful as this may be very very slow. Are you sure this is the only way to achieve what you want? Can't you replace a smaller portion of the document?

Note that this doesn't seem to work well with document.documentElement , and that using it with the document's body seems to lose the data on the original elements (say what?). Here's a small test.