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 相关文章推荐
利用CSS3的transform做的动态时钟效果
Sep 21 HTML / CSS
详解HTML5通讯录获取指定多个人的信息
Dec 20 HTML / CSS
HTML5的结构和语义(3):语义性的块级元素
Oct 17 HTML / CSS
HTML5之SVG 2D入门5—颜色的表示及定义方式
Jan 30 HTML / CSS
突袭HTML5之Javascript API扩展4—拖拽(Drag/Drop)概述
Jan 31 HTML / CSS
html5实现多图片预览上传及点击可拖拽控件
Mar 15 HTML / CSS
Html5调用手机摄像头并实现人脸识别的实现
Dec 21 HTML / CSS
浅谈HTML5新增和废弃的标签
Apr 28 HTML / CSS
使用canvas生成含有微信头像的邀请海报没有微信头像问题
Oct 29 HTML / CSS
ivx平台开发之不用代码实现一个九宫格抽奖功能
Jan 27 HTML / CSS
聊聊CSS粘性定位sticky案例解析
Jun 01 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
php注销代码(session注销)
2012/05/31 PHP
php一行代码获取文件后缀名实例分析
2014/11/12 PHP
PHP实现的mongoDB数据库操作类完整实例
2018/04/10 PHP
深入理解 PHP7 中全新的 zval 容器和引用计数机制
2018/10/15 PHP
JavaScript 获取用户客户端操作系统版本
2009/08/25 Javascript
基于jquery的仿百度搜索框效果代码
2011/04/11 Javascript
js的hasownproperty使用示例
2014/03/02 Javascript
Javascript WebSocket使用实例介绍(简明入门教程)
2014/04/16 Javascript
js中日期的加减法
2015/05/06 Javascript
jQuery结合AJAX之在页面滚动时从服务器加载数据
2015/06/30 Javascript
JavaScript判断IE版本型号
2015/07/27 Javascript
js中null与空字符串""的区别讲解
2019/01/17 Javascript
elementUI table表格动态合并的示例代码
2019/05/15 Javascript
javascript实现简易的计算器
2020/01/17 Javascript
vue项目或网页上实现文字转换成语音播放功能
2020/06/09 Javascript
Vue props中Object和Array设置默认值操作
2020/07/30 Javascript
vue.js封装switch开关组件的操作
2020/10/26 Javascript
解决Python requests 报错方法集锦
2017/03/19 Python
Python用 KNN 进行验证码识别的实现方法
2018/02/06 Python
Python多进程并发与多线程并发编程实例总结
2018/02/08 Python
Windows下将Python文件打包成.EXE可执行文件的方法
2018/08/03 Python
python matplotlib库绘制条形图练习题
2019/08/10 Python
Numpy 中的矩阵求逆实例
2019/08/26 Python
Python脚本实现Zabbix多行日志监控过程解析
2020/08/26 Python
台湾东南旅游社网站:东南旅游
2019/02/11 全球购物
乌克兰第一的珠宝网上商店:Gold.ua
2019/11/29 全球购物
外贸业务员求职自荐信分享
2013/09/21 职场文书
广播体操比赛口号
2014/06/10 职场文书
四川省传达学习贯彻党的群众路线教育实践活动总结大会精神新闻稿
2014/10/26 职场文书
践行党的群众路线心得体会
2014/11/05 职场文书
创业计划书之电动车企业
2019/10/11 职场文书
Python中使用Lambda函数的5种用法
2021/04/01 Python
python自动计算图像数据集的RGB均值
2021/06/18 Python
纯CSS如何禁止用户复制网页的内容
2021/11/01 HTML / CSS
Java字符缓冲流BufferedWriter
2022/04/09 Java/Android
MySql数据库触发器使用教程
2022/06/01 MySQL