HTML5新增的本地存储功能(笔记)
HTML5新增的本地存储功能分为两种,分别对应两个JS对象:①本地存储对应localStorage对象,主要用于长期保存整个网站的数据(这些数据可以永久保存在客户端电脑硬盘内)。②会话存储对应sessionStorage对象,用于临时保存一个窗口的数据(在这个窗口关闭之前,数据是存在的,关闭窗口之后会被浏览器删除)。无论本地存储还是会话存储,都是与网站所在的域联系在一起的(也就是说,在同一个域名内,数据是可以互相访问的)。由于这些数据是保存在用户的计算机上,网页不能访问保存在其他用户计算机上的数据,类似的,如果你用不同的用户名登陆自己的计算机或者使用不用的浏览器,那么存取的也将是不同的本地存储数据。浏览器对web存储的支持是比较好的,最低版本有:IE8、chrome5、safari4、opera10.5、safari ios2以及android2
操作本地存储和会话存储:
//保存一段信息到本地存储或会话存储中
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新增的本地存储功能(笔记)的更多相关文章
- HTML5开发学习:本地存储Web Sql Database
Web Sql Database,中文翻译作"本地数据库",是随着HTML5规范加入的在浏览器端运行的轻量级数据库. 在HTML5中,大大丰富了客户端本地可以存储的内容 ...
- HTML5教程之本地存储SessionStorage
SessionStorage: 将数据保存在session对象中,所谓session是指用户在浏览某个网站时,从进入网站到浏览器关闭所经过的这段时间会话,也就是用户浏览这个网站所花费的时间就是sess ...
- HTML5 使用localstorage 本地存储
HTML 本地存储介绍 最早的 Cookies 自然是大家都知道,问题主要就是太小,大概也就 4KB 的样子,而且 IE6 只支持每个域名20个cookies,太少了.优势就是大家都支持,而且支持得还 ...
- HTML5规范的本地存储
在HTML5 中定义了两种本地存储的,Web Storage 和本地数据库 SQL Database . 用来检查判断浏览器是否支持 Web Storage if(window.localStorag ...
- HTML5学习总结——本地存储
一.HTML4客户端存储 B/S架构的应用大量的信息存储在服务器端,客户端通过请求响应的方式从服务器获得数据,这样集中存储也会给服务器带来相应的压力,有些数据可以直接存储在客户端,传统的Web技术中会 ...
- 初识html5的localStorage本地存储
一.概述 HTML5 提供了两种在客户端存储数据的新方法: localStorage - 没有时间限制的数据存储 sessionStorage - 针对一个 session 的数据存储 之前,这些都是 ...
- h5新增属性本地存储
---恢复内容开始--- 存储的两种类型: localStorage 和 sessionStorage localstorage:没有时间限制的数据存储 sessionStorage 针对一个ses ...
- HTML5的本地存储功能,值得研究
https://developer.chrome.com/apps/offline_storage 搜索“chrome html5 本地缓存”,一大堆文章,比如: http://www.cnblogs ...
- Html5中的本地存储
Web Storage web storage页面存储是html5为数据存储在客户端提供的一项重要功能,由于web storage API能够区分会话数据与长期数据.因此,相应API也分为两种: se ...
随机推荐
- react 组件构建设计
项目设计中,可以从顶层React元素开始,然后实现它的子组件,自顶向下来构建组件的层级组件的写法:1.引入依赖模块2.定义React组件3.作为模块导出React组件4.子组件更新父组件的机制5.父组 ...
- 初期测评 E 迷障
https://vjudge.net/contest/240302#problem/E 通过悬崖的yifenfei,又面临着幽谷的考验—— 幽谷周围瘴气弥漫,静的可怕,隐约可见地上堆满了骷髅.由于此处 ...
- php错误报告和调试
3. 错误报告和调试 常常犯的一个错误是忘记关闭 PHP 错误和数据库错误报告,这样做是有风险的.在任何一个公开的站点,error_reporting 应该设置为0 ,最多只能设置为 E_ERROR, ...
- 计算机网络【10】—— Cookie与Session
一.cookie 和session 的区别 a.cookie数据存放在客户的浏览器上,session数据放在服务器上. b.cookie不是很安全,别人可以分析存放在本地的COOKIE并进行COOKI ...
- 深入理解JAVA虚拟机阅读笔记1——JAVA内存区域
一.Java内存区域 1.程序计数器 线程私有. 当前线程所执行的字节码的行号指示器.由于JAVA是多线程的,因此每个线程都独立的程序计数器. 异常:没有规定任何OutOfMemeryError情况的 ...
- 一文总结之MyBatis
目录 MyBatis 目标 MyBatis演示 Configuration.xml 映射文件 初始化配置文件 Dao Spring与MyBatis集成 pom Spring配置文件 MyBatis配置 ...
- java 连接oracle 进行增删改查
1.在DAO层新增类OraclePersionDao package com.test.dao; import java.sql.*; /** * Created by wdw on 2017/9/1 ...
- Linux相关——记录gdb基本操作(持续更新)
-----------2018.9.26更新标记----------- gdb的确是个很强大的东西啊,这里记录一下gdb的基本操作吧 后续可能会补充,但暂时感觉够用了就不写多了. 首先是ubuntu终 ...
- 洛谷 P4091 [HEOI2016/TJOI2016]求和 解题报告
P4091 [HEOI2016/TJOI2016]求和 题目描述 在2016年,佳媛姐姐刚刚学习了第二类斯特林数,非常开心. 现在他想计算这样一个函数的值: \[ f(n)=\sum_{i=0}^n\ ...
- java随机数的有趣用法
直接用代码说明,比较容易理解 package com.wz.other; import java.util.Random;import java.util.concurrent.ThreadLocal ...