localStorage和sessionStorage使用
localStorage.setItem("key","value");//存数据
localStorage.getItem("key");//取数据
localStorage.removeItem("key");//删除数据
localStorage.clear();//清空数据
sessionStorage使用用法和localStorage一样
sessionStorage是会话缓存
localStorage是持久缓存
这里简单封装了一个,默认缓存7天,获取数据时判断数据是否过期
/**
* 设置缓存数据
* 默认缓存一个星期
* @param key
* @param value
* @param exp 缓存时间(d天数,h小时,m分钟,s秒【例:7d=7天,7h=7小时,7m=7分钟】)
*/
function lStorage_set(key,value,exp) {
var timestamp = new Date().getTime();
if(typeof exp != "undefined"){
if (endWith(exp,'d')) {
exp = timestamp + parseInt(exp.replace('d','')) * 1000 * 60 * 60 * 24;
} else if(endWith(exp,'h')){
exp = timestamp + parseInt(exp.replace('h', '')) * 1000 * 60 * 60;
} else if (endWith(exp, 'm')) {
exp = timestamp + parseInt(exp.replace('m', '')) * 1000 * 60;
} else if (endWith(exp, 's')) {
exp = timestamp + parseInt(exp.replace('s', '')) * 1000;
} else {
exp = timestamp + exp;
}
}else{
exp = timestamp + (1000 * 60 * 60 * 24 * 7);
}
localStorage.setItem(key, JSON.stringify({data: value, exp: exp}));
} /**
* 获取缓存数据
* @param key
* @returns {null}
*/
function lStorage_get(key) {
var data = localStorage.getItem(key);
if(data == null){
return null;
}
var timestamp = new Date().getTime();
var dataObj = JSON.parse(data);
if(timestamp < dataObj.exp){
return dataObj.data;
}else{
localStorage.removeItem(key);
return null;
}
}
/**
* 判断data结尾是否是end
* @param data
* @param end
* @returns {boolean}
*/
function endWith(data,end){
var d = data.length - end.length;
return (d >= 0 && data.lastIndexOf(end) == d);
}
localStorage和sessionStorage使用的更多相关文章
- 似懂非懂的localStorage和sessionStorage
一.区别 相信很多人都见过这两个关于HTML5的新名词!HTML5种的web storage包含两种存储方式:localStorage和sessionStorage,这两种方式存储的数据不会自动发给服 ...
- html5存储方式localstorage和sessionStorage
html5中的Web Storage包括了两种存储方式:sessionStorage和localStorage. 区别:localStorage无时间限制,除非主动删除数据,否则永不过期:sessio ...
- localstorage 和 sessionstorage 本地存储
在我们日常的工作和实际项目中,做好数据数据缓存可以是我们的程序执行效率更高,可以使我们避免重复请求 服务器,减轻服务器的压力,可以提高使用户的体验度. 那么 HTML5 存储的目标是什么? 1.解决存 ...
- Cookie, LocalStorage 与 SessionStorage
Cookie, LocalStorage 与 SessionStorage相同点 都是储存在用户本地的数据. 意义在于避免数据在浏览器和服务器间不必要地来回传递. 三者的特点 同属于html5 ...
- localStorage与sessionStorage 的区别
通过一枚页面计数器来区别localStorage与sessionStorage. 通过一个计数变量pageconut,每刷新页面,增加的是localStorage的数量,而sessionStorage ...
- HTML5 学习笔记(三)——本地存储(LocalStorage、SessionStorage、Web SQL Database)
一.HTML4客户端存储 B/S架构的应用大量的信息存储在服务器端,客户端通过请求响应的方式从服务器获得数据,这样集中存储也会给服务器带来相应的压力,有些数据可以直接存储在客户端,传统的Web技术中会 ...
- localStorage和sessionStorage
首先自然是检测浏览器是否支持本地存储. 在HTML5中,本地存储是一个window的属性,包括localStorage和sessionStorage,从名字应该可以很清楚的辨认二者的区别,前者是一直存 ...
- HTML5 本地存储 localStorage、sessionStorage 的遍历、存储大小限制处理
HTML5 的本地存储 API 中的 localStorage 与 sessionStorage 在使用方法上是相同的,区别在于 sessionStorage 在关闭页面后即被清空,而 localSt ...
- html5 Web Storage(localStorage(),sessionStorage())
Web Storage包括了两种存储方式:sessionStorage和localStorage sessionStorage 是会话级别的存储,这些数据只有在同一个会话中的页面才能访问并且当会话结束 ...
- HTML5本地存储之localStorage、sessionStorage
1.概述 localStorage和sessionStorage统称为Web Storage,它使得网页可以在浏览器端储存数据. sessionStorage保存的数据用于浏览器的一次会话,当会话结束 ...
随机推荐
- 判断DOM元素是否出现再浏览器窗口中
几乎所有的项目都要解决这样一个问题:判断一个元素是否出现在浏览器窗口中?因为通过它我们可以极大的优化项目的性能,进而提升用户的的体验.原生javasxript获取浏览器的滚动距离和可视窗口的高度 使用 ...
- LightOJ1213 Fantasy of a Summation —— 快速幂
题目链接:https://vjudge.net/problem/LightOJ-1213 1213 - Fantasy of a Summation PDF (English) Statisti ...
- "未预编译文件 因此不能请求该文件"问题处理
手里一个项目重新编译后发布,访问时提示未预编译文件“default.aspx”, 因此不能请求该文件.综合网上的解决方法,做了如下操作: 1.重新安装了AJAX Extension: 2.项目添加引用 ...
- Understand JavaScript’s “this” With Clarity, and Master It
The this keyword in JavaScript confuses new and seasoned JavaScript developers alike. This article a ...
- INSTALL_FAILED_UID_CHANGED
ADT试图安装console显示上面的提示.网上查的办法: 1. 删除/data/app/(filename) 文件夹下的apk包 2. 删除/system/app/(filename) 文件夹下的a ...
- 51Nod - 1055:最长等差数列 (求最长的等差数列)
N个不同的正整数,找出由这些数组成的最长的等差数列. 例如:1 3 5 6 8 9 10 12 13 14 等差子数列包括(仅包括两项的不列举) 1 3 5 1 5 9 13 3 6 9 12 ...
- hdu 2899 Strange fuction —— 模拟退火
题目:http://acm.hdu.edu.cn/showproblem.php?pid=2899 模拟退火: 怎么也过不了,竟然是忘了写 lst = tmp ... 还是挺容易A的. 代码如下: # ...
- Win10+CUDA9.0+cudnn7.1安装
CUDA下载 cudnn下载 CUDA默认安装即可. cudnn下载解压之后,将对应的文件分别拷贝到CUDA Toolkit中即可: 对应的文件夹为: 若为默认安装,则应分别拷贝到的文件夹如下: C ...
- NOIP2000提高组(RQNOJ314)方格取数
题目描述 设有N*N的方格图(N<=10,我们将其中的某些方格中填入正整数,而其他的方格中则放入数字0.如下图所示(见样例): 某人从图的左上角的A 点出发,可以向下行走,也可以向右走,直到到达 ...
- R文件报错
res中drawable中的资源文件进行命名时只能用0-9或者a-z或者-,其他的东西不能使用,也禁止在重命名时开头使用大写字母