localstorage和sessionstorage使用记录(推荐)


Posted in HTML / CSS onMay 23, 2017

通过阅读各路大神对web存储locastorage和sessionstorage的用法解析,自己试用了一下,在此留个备忘。

在项目中,如果用到很多次storage,要存储很多数据,就要把它封装成函数了:

(该函数系不知名大神所写,如有侵犯原创,请联系我……)

function setStorage(key,value){
        if(!window.localStorage){
            alert("浏览器不支持localstorage");
            return false;
        }else{
            var storage=window.localStorage;
            //写入字段
            storage.setItem(key,value);
        }
    }
    function getStorage(key){
        if(!window.localStorage){
            alert("浏览器不支持localstorage");
        }else{
            var storage=window.localStorage;
            var key=storage.getItem(key);
//            console.log(key);
            return key;
        }
}

setStorage是存储数据的,key是指定的数据名称,可以随意起,但是一定要是字符串类型,否则浏览器自动把值作为key的名字。

localstorage和sessionstorage使用记录(推荐)

如图 第一个值,就是key不是以字符串指定的,即没有加双引号。

value值字符串类型的也切记加双引号。

在浏览器中如何查看storage?

较新版本的chrome浏览器,查看位置如图:

localstorage和sessionstorage使用记录(推荐)

在项目中如果多次调用同样的存储数据的函数,则数据会实时改变,如果需要清除所有存储的数据:

localstorage.clear();或者sessionStorage.clear();

项目中使用的原则就是,哪个数据需要存储,就用哪个数据调用存数数据的函数。

以上所述是小编给大家介绍的localstorage和sessionstorage使用记录(推荐),希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

HTML / CSS 相关文章推荐
CSS类名支持中文命名的示例
Apr 04 HTML / CSS
利用css3如何设置没有上下边的列表间隔线
Jul 03 HTML / CSS
浅谈pc和移动端的响应式的使用
Jan 03 HTML / CSS
Html5实现iPhone开机界面示例代码
Jun 30 HTML / CSS
HTML5 canvas画图并保存成图片的jcanvas插件
Jan 17 HTML / CSS
HTMl5的存储方式sessionStorage和localStorage详解
Mar 18 HTML / CSS
多视角3D可旋转的HTML5 Logo动画
Mar 02 HTML / CSS
html5需遵循的6个设计原则
Apr 27 HTML / CSS
简单介绍 http请求响应参数、无连接无状态、MIME、状态码、端口、telnet、curl
Mar 31 HTML / CSS
table设置超出部分隐藏,鼠标移上去显示全部内容的方法
Dec 24 HTML / CSS
使用CSS实现百叶窗效果示例代码
May 07 HTML / CSS
Html5实现文件异步上传功能
May 19 #HTML / CSS
Html5新标签datalist实现输入框与后台数据库数据的动态匹配
May 18 #HTML / CSS
HTML5中indexedDB 数据库的使用实例
May 11 #HTML / CSS
详解HTML5 window.postMessage与跨域
May 11 #HTML / CSS
HTML5拖放API实现拖放排序的实例代码
May 11 #HTML / CSS
解决html5中video标签无法播放mp4问题的办法
May 07 #HTML / CSS
Web前端页面跳转并取到值
Apr 24 #HTML / CSS
You might like
利用discuz自带通行证整合dedecms的方法以及文件下载
2007/03/06 PHP
PHP __autoload()方法真的影响性能吗?
2012/03/30 PHP
php使用ob_start()实现图片存入变量的方法
2014/11/14 PHP
Git命令之分支详解
2021/03/02 PHP
到处都是jQuery选择器的年代 不了解它们的性能,行吗
2012/06/18 Javascript
利用Javascript判断操作系统的类型实现不同操作系统下的兼容性
2013/01/29 Javascript
jQuery学习笔记之jQuery原型属性和方法
2014/06/09 Javascript
jQuery聚合函数实例
2015/05/21 Javascript
jQuery弹层插件jquery.fancybox.js用法实例
2016/01/22 Javascript
浅谈toLowerCase和toLocaleLowerCase的区别
2016/08/15 Javascript
jQuery基于正则表达式的表单验证功能示例
2017/01/21 Javascript
详解jQuery同步Ajax带来的UI线程阻塞问题及解决办法
2017/08/09 jQuery
如何去除vue项目中的#及其ie9兼容性
2018/01/11 Javascript
mui框架 页面无法滚动的解决方法(推荐)
2018/01/25 Javascript
Vue中 key keep-alive的实现原理
2018/09/18 Javascript
three.js搭建室内场景教程
2018/12/30 Javascript
在Create React App中使用CSS Modules的方法示例
2019/01/15 Javascript
layui表格内容溢出的解决方法
2019/09/06 Javascript
Layui弹出层 加载 做编辑页面的方法
2019/09/16 Javascript
基于Echarts图表在div动态切换时不显示的解决方式
2020/07/20 Javascript
javascript实现图片轮换动作方法
2020/08/07 Javascript
[16:56]heroes英雄教学 司夜刺客
2014/09/18 DOTA
[26:21]浴火之凤-TI4世界冠军Newbee战队纪录片
2014/08/07 DOTA
用Python的urllib库提交WEB表单
2009/02/24 Python
使用python实现拉钩网上的FizzBuzzWhizz问题示例
2014/05/05 Python
Java分治归并排序算法实例详解
2017/12/12 Python
在python中实现对list求和及求积
2018/11/14 Python
python 读取竖线分隔符的文本方法
2018/12/20 Python
django与小程序实现登录验证功能的示例代码
2019/02/19 Python
Python 实现一个手机号码获取妹子名字的功能
2019/09/25 Python
解析pip安装第三方库但PyCharm中却无法识别的问题及PyCharm安装第三方库的方法教程
2020/03/10 Python
广州迈达威.net面试题目
2012/03/10 面试题
交警个人先进事迹材料
2014/05/11 职场文书
财务人员入职担保书
2015/09/22 职场文书
MySQL 表空间碎片的概念及相关问题解决
2021/05/07 MySQL
python scipy 稀疏矩阵的使用说明
2021/05/26 Python