JavaScript红皮书学习(23)--离线应用与客户端存储

Posted by liveipool on February 2, 2017

离线应用与客户端存储

23.0.png

23.1 离线检测

开发离线应用的第一步是要知道设备是在线还是离线,HTML5为此定义了一个navigator.onLine属性,这个属性值为true表示设备能上网,但这个属性在各浏览器上的支持情况稍有差异,慎用。
23.1.png

23.2 应用缓存

应用缓存 w3school
23.21.png
23.22.png
23.23.png
现在还没有需要连接远程服务器的项目,在本地没法学习,以后试试。

23.3 数据存储

23.3.png

Document.cookie: https://developer.mozilla.org/zh-CN/docs/Web/API/Document/cookie
23.3.11.png
23.3.12.png
23.3.13.png
23.3.14.png
23.3.15.png
23.3.16.png
23.3.17.png
23.3.18.png
23.3.19.png
23.3.191.png
具体实现可查看红皮书或网上,原理类似。
23.3.192.png

23.3.3 Web存储机制

23.3.31.png
23.3.32.png
23.3.33.png
Storage类型只能存储字符串。非字符串的数据在存储之前会被转换成字符串。

sessionStorage 和 localStorage 对象,参考:http://www.w3school.com.cn/html5/html_5_webstorage.asp

23.3.34.png
23.3.36.png
23.3.37.png
23.3.38.png
23.3.39.png

23.3.4 IndexedDB

23.3.41.png
23.3.42.png
23.3.43.png
23.3.44.png
23.3.45.png
23.3.46.png
23.3.47.png
23.3.48.png
23.3.49.png
23.3.491.png
23.3.492.png
23.3.493.png
23.3.494.png
23.3.495.png
23.3.496.png
23.3.497.png
23.3.498.png
23.3.499.png
23.3.4991.png

23.4 小结

23.41.png
23.42.png