javascript - How to maintain page state if user navigates away from page? -

i have page alters dom based on user interaction. however, user might click on link, navigate external site. if user clicks button, page shown again, dom changes not persist.

what best way keep track of user interactions can rebuild page on return?

to maintain state , rebuild page, need keep track of 7-10 variables.

some ideas had:

• server-side session - require callback server every time variable changes value?
• client-side cookies - if user disables cookies?
• hidden form fields - (all?) browsers locally cache form data, hitting button should retain?

try session variable:

sessionstorage.setitem('key', { "data": "mad data here" }); 

then recall it:

var data = sessionstorage.getitem('key'); 

you use jquery such upon loading page:

document.load(function() {      var data = sessionstorage.getitem('key');     if (data) {         data.dostuff();     } }