How To Store Javascript Html Dom Document To Locastorage

I have document (component tree) 'm' which i am trying to store in the local storage of html5. I tried setting it to local storage. but when i retrieve it back, this m has changed

Solution 1:

You need to store a string representation of the document's html by doing:

localStorage.setItem('calendar', document.documentElement.innerHTML);

When you do this:

localStorage.setItem('calendar', document.documentElement);

...it stores the result of document.documentElement.toString() in localStorage, which doesn't work for your purpose.

Solution 2:

localStorage converts every value to a string. To store objects you have to use a workaround.

I guess you could use the method described in this answer

var testObject = { 'one': 1, 'two': 2, 'three': 3 };

// Put the object into storagelocalStorage.setItem('testObject', JSON.stringify(testObject));

// Retrieve the object from storagevar retrievedObject = localStorage.getItem('testObject');

console.log('retrievedObject: ', JSON.parse(retrievedObject));