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使用多列制作瀑布流
May 10 HTML / CSS
CSS3 2D模拟实现摩天轮旋转效果
Nov 16 HTML / CSS
CSS3 Notes: -webkit-box-reflect实现倒影的实例
Dec 08 HTML / CSS
HTML5+CSS3 诱人的实例:3D立方体旋转动画实例
Dec 30 HTML / CSS
CSS3的颜色渐变效果的示例代码
Sep 29 HTML / CSS
CSS3中的弹性布局em运用入门详解 1em等于多少像素
Feb 08 HTML / CSS
使用HTML5 IndexDB存储图像和文件的示例
Nov 05 HTML / CSS
关于前端上传文件全面基础扫盲贴(入门)
Aug 01 HTML / CSS
html5 Canvas画图教程(10)—把面拆成线条模拟出圆角矩形
Jan 09 HTML / CSS
详解webapp页面滚动卡顿的解决办法
Dec 26 HTML / CSS
关于解决iframe标签嵌套问题的解决方法
Mar 04 HTML / CSS
CSS3 制作的图片滚动效果
Apr 14 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高级编程实例:编写守护进程
2014/09/02 PHP
微信支付开发动态链接Native支付
2016/07/12 PHP
Google Suggest ;-) 基于js的动态下拉菜单
2006/10/11 Javascript
javascript StringBuilder类实现
2008/12/22 Javascript
JavaScript中将数组进行合并的基本方法讲解
2016/03/07 Javascript
简单实现IONIC购物车功能
2017/01/10 Javascript
vue.js学习笔记:如何加载本地json文件
2017/01/17 Javascript
JS拉起或下载app的实现代码
2017/02/22 Javascript
无法获取隐藏元素宽度和高度的解决方案
2017/03/07 Javascript
Angular中ng-bind和ng-model的区别实例详解
2017/04/10 Javascript
JavaScript原型继承_动力节点Java学院整理
2017/06/30 Javascript
JavaScript解析任意形式的json树型结构展示
2017/07/23 Javascript
详解vue项目首页加载速度优化
2017/10/18 Javascript
简单说说如何使用vue-router插件的方法
2019/04/08 Javascript
Echarts动态加载多条折线图的实现代码
2019/05/24 Javascript
在vue中高德地图引入和轨迹的绘制的实现
2019/10/11 Javascript
vue输入框使用模糊搜索功能的实现代码
2020/05/26 Javascript
JavaScript实现滚动加载更多
2020/12/27 Javascript
使用Python实现BT种子和磁力链接的相互转换
2015/11/09 Python
Django添加KindEditor富文本编辑器的使用
2018/10/24 Python
解决Mac下首次安装pycharm无project interpreter的问题
2018/10/29 Python
python opencv 读取图片 返回图片某像素点的b,g,r值的实现方法
2019/07/03 Python
python实现一行输入多个值和一行输出多个值的例子
2019/07/16 Python
pandas中read_csv的缺失值处理方式
2019/12/19 Python
Django实现微信小程序支付的示例代码
2020/09/03 Python
英国时尚配饰、珠宝和服装网站:KJ Beckett
2020/01/23 全球购物
用C#语言写出与SQLSERVER访问时的具体过程
2013/04/16 面试题
实践单位评语
2014/04/26 职场文书
2014年安全生产工作总结
2014/11/13 职场文书
2014年个人业务工作总结
2014/11/17 职场文书
财务总监岗位职责范本
2015/04/03 职场文书
全陪导游词开场白
2015/05/29 职场文书
2015年清剿火患专项行动工作总结
2015/07/27 职场文书
go语言map与string的相互转换的实现
2021/04/07 Golang
Pytorch 使用tensor特定条件判断索引
2021/04/08 Python
Python自动化之批量处理工作簿和工作表
2021/06/03 Python