3.1.1 HTML5存储

一.介绍

二.HTML5本地存储

（一）.Localstorage

（二）.API

（三）.存储时效

（四）.indexDB

（五）.indexDB-索引

（六）.indexDB-游标

三.游标索引结合与区别

（一）.IndexDB-游标索引结合

（二）.indexDB-区别

四.课程总结

 

 

(一）介绍

1.本地存储：(1).web storage    (2).IndexedDB

2.本地存储的扩展介绍。

3.离线存储-app cache。

4.分析存储需求：(1).照顾2g，3g网络的体验。(2).流量节省。(3).在离线情况下使用。

cookie做不到，cookie的局限性：存储大小限制，仅4kb。单个域名下的数量限制，50个左右。污染请求头，浪费流量。

 

二．HTML5本地存储

（一）Localstorage

localStorage和sessionStorage

1.本地存储和离线存储相同的使用方法：

(1).setItem方法设置存储内容。localStorage.setItem('Key', 'Value');

(2).getItem方法获取存储内容。localStorage.getItem('Key');//返回value值。

(3).使用removeItem方法删除存储内容。(一个一个删) localStorage.removeItem('Key');//删除这个key的数据。
 

对象[key]=value

对象.key=value

sessionStorage同理。

---------------------------------------------------------

(4).使用clear方法清除所有内容。（全部清空）sessionStorage.clear();

(5).使用length属性获取存储内容个数。sessionStorage.length;

(6).使用key方法获取存储字段。sessionStorage.key(0);//获取第一个key的名称，依次类推。

localStorage同理。

2.不同的存储时效：

localStorage存储会持久化。

sessionStorage存储会在网页会话结束（标签页的关闭）后失效。（刷新没事）。

3..不同的存储容量：