Html5 web 本地存储 (localStorage、sessionStorage)
HTML5 提供了两种在客户端存储数据的新方法localStorage,sessionStorage
sessionStorage(临时存储) :为每一个数据源维持一个存储区域,在浏览器打开期间存在,包括页面重新加载
localStorage(长期存储) :与 sessionStorage 一样,但是浏览器关闭后,数据依然会一直存在
web storage的浏览器支持情况
浏览器的支持除了IE7及以下不支持外,其他标准浏览器都完全支持(ie及FF需在web服务器里运行),值得一提的是IE总是办好事,例如IE7、IE6中的UserData其实就是javascript本地存储的解决方案。通过简单的代码封装可以统一到所有的浏览器都支持web storage。要判断浏览器是否支持localStorage可以使用下面的代码:
if(window.localStorage){
alert("浏览支持localStorage")
}
else
{
alert("浏览暂不支持localStorage")
}
//或者 if(typeof window.localStorage == 'undefined'){ alert("浏览暂不支持localStorage") }
API
1,保存数据到本地
sessionStorage.setItem('key', value) //name 是本地存储的值的名字, value是本地存储值,注意value必须是字符串的形式
localStorage.setItem('key', value) //setItem把值存到本地,其中name 是本地存储的值的名字, value是本地存储值,注意value必须是字符串的形式
2,从本地获取数据
var data1 = JSON.parse(sessionStorage.getItem('key'));
var data2 = JSON.parse(localStorage.getItem('key'));
3,从本地删除某个数据
sessionStorage.removeItem('key');
localStorage.removeItem('key');
4,删除所有保存在本地的数据
sessionStorage.clear();
localStorage.clear();
chrome浏览器查看的方法
按F12,然后选择application就可以看到了

Cookie、session和localStorage、以及sessionStorage之间的区别:https://blog.csdn.net/ruby_xc/article/details/65939988
Html5 web 本地存储 (localStorage、sessionStorage)的更多相关文章
- html5的本地存储localStorage和sessionStorage
html5的本地存储localStorage和sessionStorage html5中新增的比较重要的一个功能就是web storage来实现客户端本地存储数据,之前存储数据都是用cookie来实现 ...
- 移动端浏览器隐私模式/无痕模式使用本地存储localStorage/sessionStorage的问题
移动端浏览器隐私模式/无痕模式使用本地存储localStorage/sessionStorage的问题 开发H5 webapp时经常需要使用本地存储,如localStorage和sessionStor ...
- 本地存储localStorage sessionStorage 以及 session 和cookie的对比和使用
cookie和session都是用来跟踪浏览器用户身份的会话方式. 1.验证当前服务中继续请求数据时,哪些缓存数据会随着发往服务器? 只有cookie中设置的缓存数据会发送到服务器端 2. 强调几点: ...
- 本地存储 localStorage/sessionStorage/cookie
cookie是个基础的东西.是服务器发送到客户端,存储在客户端的一小段数据.可以存储一些配置信息,客户标识信息等.用户下次访问这个网站时,会把上次网站发来的cookie一同发送回去.cookie保存在 ...
- HTML5的本地存储 LocalStorage
localStorage顾名思义,就是本地存储的意思,在以前很长一段时间,要想在客户端存 储一些配置及登录信息等数据都只能通过COOKIE或flash的方式,如今html5来临,也 带来了更强大的本地 ...
- web本地存储localStorage和sessionStorage
用谷歌浏览器调试网页程序时候发现有一个这个栏目 记录本地存储的相关信息(cookie,sessionStorage,LocalStorage等)的存储信息 1.LocalStorage localst ...
- HTML5之本地存储localstorage
Web Storage是HTML5引入的一个非常重要的功能,可以在客户端本地存储数据,类似HTML4的cookie,但可实现功能要比cookie强大的多,cookie大小被限制在4KB,Web Sto ...
- Html5 web本地存储
Web Storage是HTML5引入的一个非常重要的功能,可以在客户端本地存储数据,类似HTML4的cookie,但可实现功能要比cookie强大的多,cookie大小被限制在4KB,Web Sto ...
- sessionStorage html5客户端本地存储之sessionStorage及storage事件
可以看一下<JavaScript本地存储实践(html5的localStorage和ie的userData)>sessionStorage和上文中提到的localStorage非常相识,方 ...
随机推荐
- java日志框架log4j详细配置及与slf4j使用教程
一.log4j基本用法 首先,配置log4j的jar,maven工程配置以下依赖,非maven工程从maven仓库下载jar添加到“build path” 1 2 3 4 5 <dependen ...
- Python 安装与专属 IDE_Pycharm 安装配置、永久激活,赠汉化版!
这个为什么说是一次学生时代的经历呢,我的出发点并没有是为了吊胃口.确实,这个Python小应用,只能在学生时代用得着吧,尤其是高中和大学,如果你没有想到也没关系,看完我下面说的就会明白了. 对红蜘蛛软 ...
- 3.PO如何给开发团队讲好故事
敏捷开发系列文章目录 讲出符合开发团队味口的故事. 上一章说了敏捷开发团队的构成与迭代过程,本章重点说一下迭代第一天的计划会议.熟话说“好的开始就成功了一半”,一个迭代的计划会议做得好不好确实直接注定 ...
- JAVA的关键特性
Java团队对设计Java时的关键考虑因素进行了总结,关键特性包含以下列表: 简单性 安全性 可移植性 面向对象 健壮性 多线程 体系结构中立 解释执行 高性能 分布式 动态性 简单性 Java的设计 ...
- 精确的double加减乘除运算工具类
import java.math.BigDecimal; /** * 精确的double加减乘除运算 * @author cyf * */ public class DoubleUtil { /** ...
- monkey测试入门2--测试步骤、常用参数、常规monkey命令
<凤栖梧> 柳永 伫倚危楼风细细,望极春愁,黯然生天际.草色烟光残照里,无言谁会凭栏意? 拟把疏狂图一醉,对酒当歌,强乐还无味,衣带渐宽终不悔,为伊消得人憔悴. 简要步骤:adb devi ...
- 将exe依赖运行的dll,合并入exe中,整个程序仅存在一个exe文件
方法一: 使用ILMerge合并winform生成的exe和引用的dll文件 参考:https://blog.csdn.net/u010108836/article/details/76782375 ...
- 5. 使用Flask蓝图(blueprint)
一直到现在都没有怎么写代码,可能更得比较慢. 作业回顾 先来看一下文章4的作业吧,使用logbook的时候,遇到了时区不对的情况.那么我们怎么去解决这个问题呢? 实际上logbook默认采用的是世界标 ...
- 《图解 HTTP 》阅读 —— 第一章
第1章 了解web及网络基础 计算机与网络设备相互通信的规则称为协议,比如:如何探测到通信目标.由哪一边发起通信.使用那种语言进行通信.怎么结束通信等. TCP/IP 协议族按照层次分为以下四层:应用 ...
- 使用C#采集Shibor数据到Excel
对Shibor的变化一直以来比较关注,正好最近学习了对html数据处理的一些知识,就打算拿来采集一些我需要的Shibor数据. 使用到的库 HttpAgilityPack 一个非常不错的html解析工 ...