博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
关于HTML5本地缓存技术LocalStorage 本地存储 和 SessionStorage
阅读量:7240 次
发布时间:2019-06-29

本文共 1482 字,大约阅读时间需要 4 分钟。

如果你想在用户访问的时候记录或者记住他们的行为,你会想到的是什么,cookie 和session。但今天告诉你还有两种或者说是1种吧 那就是html5的 LocalStorage 本地存储和 SessionStorage 本地存储基于会话

查看浏览器是否支持,(但现在主流浏览器基本都支持):

if(window.sessionStorage){     alert("浏览支持sessionStorage") }else{    alert("浏览暂不支持sessionStorage") }

  在js文件中的使用很简单:

var storage = window.sessionStorage;var utm_source = "{:$utm_source}";if(utm_source){        storage.setItem('utm_source',utm_source);}alert(storage.getItem('utm_source'));

LocalStorage

SessionStorage

两者使用格式都一样,但区别是 SessionStorage基于会话,关闭浏览器会消失。而LocalStorage 需要使用销毁:

存储数据的方法就是直接给window.localStorage添加一个属性,例如:window.localStorage.a 或者 window.localStorage["a"]。它的读取、写、删除操作方法很简单,是以键值对的方式存在的,如下:

localStorage.a = 3;//设置a为"3"localStorage["a"] = "sfsf";//设置a为"sfsf",覆盖上面的值localStorage.setItem("b","isaac");//设置b为"isaac"var a1 = localStorage["a"];//获取a的值var a2 = localStorage.a;//获取a的值var b = localStorage.getItem("b");//获取b的值localStorage.removeItem("c");//清除c的值

 

 

这里最推荐使用的自然是getItem()和setItem(),清除键值对使用removeItem()。如果希望一次性清除所有的键值对,可以使用clear()。另外,HTML5还提供了一个key()方法,可以在不知道有哪些键值的时候使用,如下:

var storage = window.localStorage;function showStorage(){ for(var i=0;i
"); }}

当然还有更多相关的文章可以点击这里:  

 

写一个最简单的,利用本地存储的计数器:

var storage = window.localStorage;if (!storage.getItem("pageLoadCount")) storage.setItem("pageLoadCount",0);storage.pageLoadCount = parseInt(storage.getItem("pageLoadCount")) + 1;//必须格式转换document.getElementByIdx_x("count").innerHTML = storage.pageLoadCount;showStorage();

 

 

转载于:https://www.cnblogs.com/patf/p/6060843.html

你可能感兴趣的文章
交换机、集线器、路由器区别(转)
查看>>
UITextField,UITextView字数限制
查看>>
Spring 循环依赖
查看>>
sencha touch 在线实战培训 第一期 第二节
查看>>
Mirror--使用证书配置镜像模板
查看>>
ArcGIS 10 安装程序及破解文件
查看>>
C#中读写JSON风格的配置信息
查看>>
Spring-Context之一:一个简单的例子
查看>>
(转)S5PV210 三个Camera Interface/CAMIF/FIMC的区别
查看>>
struct和typedef struct
查看>>
9.5 在 C# 中使用 F# 库
查看>>
2016第6周六
查看>>
Windows 下 绿化 Oracle
查看>>
利用京东云擎架设免费Wordpress 博客(git方式)
查看>>
Linux开发环境搭建与使用——ubuntu更新设置
查看>>
POJ 3740 Dancing Links
查看>>
iOS开发--使用NSMutableAttributedString 实现富文本
查看>>
十一、jdk命令之Jstatd命令(Java Statistics Monitoring Daemon)
查看>>
iOS开发小技巧--TableView Group样式中控制每个section之间的距离
查看>>
18.OGNL与ValueStack(VS)-值栈入门
查看>>