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中的border-radius(边框圆角)示例代码
Jul 19 HTML / CSS
CSS3中使用RGBA设置透明度的示例
Aug 04 HTML / CSS
animation和transition的区别
Oct 12 HTML / CSS
浅谈three.js中的needsUpdate的应用
Nov 12 HTML / CSS
HTML5注册页面示例代码
Mar 27 HTML / CSS
让ie浏览器成为支持html5的浏览器的解决方法(使用html5shiv)
Apr 08 HTML / CSS
Html5 Geolocation获取地理位置信息实例
Dec 09 HTML / CSS
HTML5离线应用与客户端存储的实现
May 03 HTML / CSS
详解android与HTML混合开发总结
Jun 06 HTML / CSS
Html5通过数据流方式播放视频的实现
Apr 27 HTML / CSS
HTML CSS 一个标签实现带动画的抖音LOGO
Apr 26 HTML / CSS
CSS中使用grid布局实现一套模板多种布局
Jul 15 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代码(抓取网页中的邮箱地址)
2012/07/17 PHP
PHP正则表达式之定界符和原子介绍
2012/10/05 PHP
php+curl 发送图片处理代码分享
2015/07/09 PHP
PHP中ajax无刷新上传图片与图片下载功能
2017/02/21 PHP
js三种排序算法分享
2012/08/16 Javascript
仿谷歌主页js动画效果实现代码
2013/07/14 Javascript
Jquery绑定事件(bind和live的区别介绍)
2013/08/23 Javascript
JS实现鼠标单击与双击事件共存
2014/03/08 Javascript
jQuery异步加载数据并添加事件示例
2014/08/24 Javascript
JavaScript插件化开发教程 (四)
2015/01/27 Javascript
node.js集成百度UE编辑器
2015/02/05 Javascript
jQuery实现的选择商品飞入文本框动画效果完整实例
2016/08/10 Javascript
Vue.js展示AJAX数据简单示例讲解
2017/03/29 Javascript
Vue单页及多页应用全局配置404页面实践记录
2018/05/22 Javascript
JavaScript实现表单注册、表单验证、运算符功能
2018/10/15 Javascript
微信小程序实现分享朋友圈的图片功能示例
2019/01/18 Javascript
js模拟实现百度搜索
2020/06/28 Javascript
Python中的super用法详解
2015/05/28 Python
python实现字符串连接的三种方法及其效率、适用场景详解
2017/01/13 Python
Python中动态检测编码chardet的使用教程
2017/07/06 Python
Django权限机制实现代码详解
2018/02/05 Python
Python2.7环境Flask框架安装简明教程【已测试】
2018/07/13 Python
Pytorch模型转onnx模型实例
2020/01/15 Python
使用SQLAlchemy操作数据库表过程解析
2020/06/10 Python
CSS3实现的闪烁跳跃进度条示例(附源码)
2013/08/19 HTML / CSS
HTML5网页音乐播放器的示例代码
2017/11/09 HTML / CSS
Html5踩坑记之mandMobile使用小记
2020/04/02 HTML / CSS
编写用C语言实现的求n阶阶乘问题的递归算法
2014/10/21 面试题
行政人员岗位职责
2013/12/08 职场文书
竟聘演讲稿范文
2013/12/31 职场文书
校三好学生主要事迹
2014/01/11 职场文书
《音乐之都维也纳》教学反思
2014/04/16 职场文书
社区科普工作方案
2014/06/03 职场文书
药店促销活动策划方案
2014/08/24 职场文书
2014年高校辅导员工作总结
2014/12/09 职场文书
小学数学继续教育研修日志
2015/11/13 职场文书