体面的html5离线存储和缓存示例

Question

我热衷于测试html离线存储和缓存，以期开发一个原型来展示html5的离线Web应用程序功能。

我发现了一些特定于webkit的示例，但我正在努力寻找任何可以在Firefox 3.6中运行的代码示例

对于一个样本，我会对以下内容有所帮助：

• 我们公司广泛使用jquery所以我更喜欢使用该库或纯JavaScript的样本。
• 它应该至少适用于firefox（3.6+很好）

有人能指出一些提供一些指导和代码示例的链接吗？

Answer 1

请参阅http://hacks.mozilla.org/?s=localStorage

Firefox不支持SQL数据库API，如果您正在寻找它。

Answer 2

我找到了这个例子，这是我在localstorage中看到的最简单/最好的事情。它仅演示本地（持久）存储，而不是数据库存储。此外，如果您想要会话存储，只需将“localStorage”更改为sessionStorage“

我认为javascript不可能更简单。

w3.org example

是的，它适用于FF（至少对我来说。）

Answer 3

我建议查看CSS Ninja的Font Dragr demonstration，虽然主要用于演示使用Firefox的HTML5文件API，但也使用了离线存储。

如果不出意外，这家伙知道他的东西，可以提出很好的例子。

Answer 4

我最近发现了这个非常好的html5演示页面，所以我想把它发布回来。

html5demos.com

修改 - 可能有用的其他链接：

来自谷歌Chrome开发团队的HTML5rocks是一个网站，可以让网站管理员了解HTML5的强大新功能。

www.html5rocks.com

编辑＃2 - 这是我遇到过的最好的文章之一：

wrapping things nicely with html5 local storage

Answer 5

现在所有主流浏览器都支持了解离线存储，我提出了一个用于处理表单状态的jQuery插件。 http://www.jasonsebring.com/dumbFormState来源很小且易于理解。

我推荐使用Douglas Crockford的JSON2.stringify进行序列化的方法： https://github.com/douglascrockford/JSON-js在JavaScript中获取对象并将其转换为JSON字符串。然后你可以将它保存到window.sessionStorage或window.localStorage中，就像这样：

//设置数据

window.sessionStorage ['mydata'] = JSON.stringify（someObject）;

//收回它

someObject = jQuery.parseJSON（window.sessionStorage ['mydata']）;

要考虑的另一件事是命名空间键。对于我正在做的事情，我希望它是自动的，因此根据'dumbFormState-'+ window.location.pathname +保存关键名称 ' - '+表单索引，以确保键自动唯一，然后你可以循环它们以后通过检查匹配键的前缀'dumbFormState-'删除它们，因为你不想删除那里的人可能的任何其他东西使用

希望有所帮助。