html5 sessionStorage 与 localStorage存储
sessionStorage用于本地存储一个会话(session)中的数据,这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。因此sessionStorage不是一种持久化的本地存储,仅仅是会话级别的存储。
而localStorage用于持久化的本地存储,除非主动删除数据,否则数据是永远不会过期的。 浏览器支持情况: 浏览器的支持除了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")} localStorage和sessionStorage都具有相同的操作方法,例如setItem、getItem和removeItem等
用法:.setItem( key, value)
代码示例:
sessionStorage.setItem("key", "value"); localStorage.setItem("site", "js8.in"); getItem获取value用途:获取指定key本地存储的值
用法:.getItem(key)
代码示例:
var value = sessionStorage.getItem("key"); var site = localStorage.getItem("site"); removeItem删除key用途:删除指定key本地存储的值
用法:.removeItem(key)
代码示例:
sessionStorage.removeItem("key"); localStorage.removeItem("site"); clear清除所有的key/value用途:清除所有的key/value
用法:.clear()
代码示例:
sessionStorage.clear(); localStorage.clear();
使用实例: <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<input type='button' onclick='set_item()' value='存值' />
<input type='button' onclick='get_item()' value='取值' />
<input type='button' onclick='delete_item()' value='删除' />
<script>
//localStorage 存值永久有效
function set_item(){
var user = {};
user.name = 'Adam Li';
user.age = 25;
user.home = 'China';
localStorage.setItem('userinfo',JSON.stringify(user));
}
//localStorage取值
function get_item(){
var data = JSON.parse(localStorage.getItem('userinfo'));
alert("name:"+data.name+"\r age:"+data.age+"\r home:"+data.home);
}
//localStorage删除指定键对应的值
function delete_item(){
localStorage.removeItem('userinfo');
alert(localStorage.getItem('userinfo'));
}
</script> /* sessionStorage使用方法请参照localStorage使用例子,实际应用要用哪个关键看你需求了,如果是要永久保存的,那么就请使用localStorage方法存取值,如果是要浏览关闭会话结束就清除缓存的,当然就得选择sessionStorage方法了 */
html5 sessionStorage 与 localStorage存储的更多相关文章
- [Html5]sessionStorage和localStorage常见操作
摘要 [Html5]sessionStorage和localStorage的区别 索引 上篇文章简单介绍了它们的区别,已经常见的用法.那我们能通过. 或者类似dic[key]的方式访问吗?答案是当然可 ...
- 使用sessionStorage、localStorage存储数组与对象(转)
http://my.oschina.net/crazymus/blog/371757 使用sessionStorage.localStorage存储数组与对象 发表于3个月前(2015-01-26 1 ...
- 使用sessionStorage、localStorage存储数组与对象
先介绍一下localStorage localStorage对象是HTML5的客户端存储持久化数据的方案.为了能访问到同一个localStorage对象,页面必须来自同一个域名(子域名无效),使用同一 ...
- [Html5]sessionStorage和localStorage的区别
摘要 有时需要在浏览器中保存一些数据,特别在app中嵌入的h5页面中,需要在webview中保存一些数据,作为客户端的数据持久化. h5中web storage有两种存储方式:sessionStora ...
- HTML5 WEB Storage - localStorage存储位置在哪
localStorage作为客户端浏览器持久化存储方案 这个是浏览器隔离的,每个浏览器都会把localStorage存储在自己的UserData中,如chrome一般就是 C:\Users\你的计算机 ...
- sessionStorage和localStorage存储的转换不了json
先说说localStorage与sessionStorage的差别 sessionStorage是存储浏览器的暂时性的数据,当关闭浏览器下次再打开的时候就不能拿到之前存储的缓存了 localStora ...
- sessionStorage、localStorage 存储及如何存储数组与对象
1.存储,获取,清楚 sessionStorage.setItem("key",val) sessionStorage.getItem("key") sessi ...
- HTMl5的存储方式sessionStorage和localStorage详解
html5中的Web Storage包括了两种存储方式:sessionStorage和localStorage.sessionStorage用于本地存储一个会话(session)中的数据,这些数据只有 ...
- HTMl5的sessionStorage和localStorage
HTMl5的sessionStorage和localStorage html5中的Web Storage包括了两种存储方式:sessionStorage和localStorage. sessionSt ...
随机推荐
- Base64原理解析
一. Base64编码由来 为什么会有Base64编码呢?因为有些网络传送渠道并不支持所有的字节,例如传统的邮件只支持可见字符的传送,像ASCII码的控制字符就 不能通过邮件传送.这样用途就受到了很大 ...
- 关于C++默认初始化的总结——开个坑
关于C++初始化总结的博客,其实以前在我的独立博客上写过相关的内容,可惜呀,没有续费,腾讯回收了我的空间, 到现在,关于C++初始化的内容,一直是我的心头病,现在准备开个坑,慢慢的总结进来吧. 1.关 ...
- bzoj 1146 [CTSC2008]网络管理Network
很久之前写过 count on the tree. 然后一直不懂树状数组是怎么套上这个主席树的. 看了两小时发现它套的就是个权值线段树, 看不出来可持久化在哪里. 因为动态开点所以空间nlog2n. ...
- [Reproduced works]MongoDB Unauthorized Access Vulnerability
mongodb未授权访问漏洞 catalogue 1. mongodb安装 2. 未授权访问漏洞 3. 漏洞修复及加固 4. 自动化检测点 1. mongodb安装 apt-get install m ...
- iOS 开发总结(上)
来源:蝴蝶之梦天使 链接:http://www.jianshu.com/p/d333cf6ae4b0 在iOS开发中经常需要使用的或不常用的知识点的总结,几年的收藏和积累(踩过的坑). 一. iPho ...
- 懒加载(getter\setter理解)
为什么要用懒加载 1.首先看一下程序启动过程:(如图) 会有一个mian的设置,程序一启动会加载main.storyboard main.storyboard又会加载箭头所指的控制器 控制器一旦加载, ...
- R语言获取数据类型信息的一些有用函数
向量.因子.时间序列x[i]: 矩阵.数据框x[i, j] x[i, ] x[, j]: 数组就是根据维度多打几个逗号而已x[i, j, k, -]: 列表要用双重中括号x[[i]]. 特殊的 ...
- kailli linux download
https://www.offensive-security.com/kali-linux-arm-images/ Courses Certifications Online Labs Penetra ...
- UP Board 串口使用心得
前言 原创文章,转载引用务必注明链接. 本文使用Markdown写成,为获得更好的阅读体验和正常的图片.链接,请访问我的博客: http://www.cnblogs.com/sjqlwy/p/up_s ...
- Java Annotation概述
@(Java)[Annotation|Java] Java Annotation概述 用途 编译器的相关信息,如用于检测错误和一些警告 编译时和部署时的处理,如一些软件用于自动生成代码之类的 运行时处 ...