HTML5新增的本地存储功能(笔记)
2014-05-30 13:21
369 查看
HTML5新增的本地存储功能分为两种,分别对应两个JS对象:①本地存储对应localStorage对象,主要用于长期保存整个网站的数据(这些数据可以永久保存在客户端电脑硬盘内)。②会话存储对应sessionStorage对象,用于临时保存一个窗口的数据(在这个窗口关闭之前,数据是存在的,关闭窗口之后会被浏览器删除)。无论本地存储还是会话存储,都是与网站所在的域联系在一起的(也就是说,在同一个域名内,数据是可以互相访问的)。由于这些数据是保存在用户的计算机上,网页不能访问保存在其他用户计算机上的数据,类似的,如果你用不同的用户名登陆自己的计算机或者使用不用的浏览器,那么存取的也将是不同的本地存储数据。浏览器对web存储的支持是比较好的,最低版本有:IE8、chrome5、safari4、opera10.5、safari ios2以及android2
操作本地存储和会话存储:
删除存储数据:只要调用removeItem()方法,存入要删除的属性名就可以删除不想要的数据了,也可以调用clear()方法,清空网站的存储数据(本地存储和会话存储都适用):
查找所有数据:适用key()方法可以从本地或会话存储中取得当前网站保存的所有数据
数据类型:通过localStorage或sessionStorage对象保存起来的数据,都会自动转换为字符串。如果要调用这两个对象里面的值是数字,则需要先把字符串转换为数字才能用。如果是对象,则可以通过JSON.parse()方法转换为对象在调用。
操作本地存储和会话存储:
//保存一段信息到本地存储或会话存储中 localStorage[keyName] = data; sessionStorage[keyName] = data; //如果要检测某个属性值是否为空,可以直接测试它是否等于null if (localStorage['name'] == null){alert('没有保存name这个属性')}
删除存储数据:只要调用removeItem()方法,存入要删除的属性名就可以删除不想要的数据了,也可以调用clear()方法,清空网站的存储数据(本地存储和会话存储都适用):
//删除某个存储数据 localStorage.removeItem('user_name'); //删除所有存储数据 localStorage.clear();
查找所有数据:适用key()方法可以从本地或会话存储中取得当前网站保存的所有数据
数据类型:通过localStorage或sessionStorage对象保存起来的数据,都会自动转换为字符串。如果要调用这两个对象里面的值是数字,则需要先把字符串转换为数字才能用。如果是对象,则可以通过JSON.parse()方法转换为对象在调用。
相关文章推荐
- 本地存储(html5的localStorage和ie的userData)微博回填功能
- 利用html5的本地存储功能实现登录用户信息保存
- HTML5新增核心工具——本地存储
- HTML5 本地存储实现购物车功能
- HTML5新增API学习笔记(二)本地程序缓存
- HTML5学习笔记:HTML5基于本地存储SQLite的每日工作任务清单程序.[只支持chrome]
- html5笔记:跨域通讯、多线程、本地存储和多图片上传技术
- 利用html5的本地存储功能实现登录用户信息保存
- 一款功能强大并且可以结合html5实现本地存储的数据库 – SQLite学习文档
- HTML5学习笔记:HTML5基于本地存储SQLite的每日工作任务清单程序.[只支持chrome]
- HTML5笔记:跨域通讯、多线程、本地存储和多图片上传技术
- HTML5笔记:跨域通讯、多线程、本地存储和多图片上传技术(转)
- HTML5本地储存追加利用html5的本地存储功能实现登录用户信息保存
- HTML5培训第12节课堂笔记(本地存储、mui打开新页面、创建子页面)
- 探索HTML5本地存储功能运用技巧
- 一款功能强大并且可以结合html5实现本地存储的数据库 – SQLite学习文档
- 探索HTML5本地存储功能运用技巧(1)
- HTML5的本地存储功能,使用localStorage
- 一款功能强大并且可以结合html5实现本地存储的数据库 – SQLite学习文档
- HTML5本地存储(Local Storage) 的前世今生(二)