如何使用"localStorage"存储整个页面? [英] How can I use `localStorage` to store an entire page?
问题描述
我一直在阅读《 HTML在行动》 这本书，在第5章中，它展示了如何创建可以离线运行的移动应用程序.我唯一的疑问是:我可以在整个页面上执行此操作吗?您能给我一个简单但完整的示例吗?
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 entire page? Can you give me a simple, but complete, example on how to do it?
谢谢.
推荐答案
Kinda疯狂，但您可以这样做:
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!
此外，您以后还要做什么.好吧，它仅在您的浏览器中..因此，它仅对您可用. 对于appCahce方法，基本上，您将告诉访问的浏览器您希望存储在缓存中的文件，以便在用户脱机时可以使用它们.
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.
这需要在HTML属性中定义:
<html manifest="offline_book.manifest">
此offline_book.manifest将包含要存储在缓存中的文件列表.
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.
有关appCache详细信息的出色资源:离线网页
An excellent resource into the appCache specifics: Offline Webpages
这篇关于如何使用"localStorage"存储整个页面?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
