How can I use `localStorage` to store an entire page?

Question

I\'ve been reading the book HTML in action and in chapter 5, it shows how to create a mobile application that can be run offline. My only doubt is: can I do this for an

Answer 1

Kinda crazy but you could do it like so:

var htmlContents = document.documentElement.innerHTML;
localStorage.setItem('myBook', JSON.stringify(htmlContents ));

From there you can call it up whenever you like..

localStorage.getItem('myBook');

It would be better of course to get the actually book contents of course instead of the entire page!

Also as for what you want to do with this later. Well its only in your browser.. so its accessible only to you. for the appCahce method, basically you will be telling the visiting browser of the files you wish to store in the cache so they are available when the user is offline.

This needs to be defined in the HTML attribute:

This offline_book.manifest will contain the file list to store in the cache.

CACHE MANIFEST
/book_index.html
/another_book.html
/maybe_some_style.css

Through this, then when the users come back to this page (offline), they will have a cached version of the books you have listed.

An excellent resource into the appCache specifics: Offline Webpages