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动画效果
Aug 14 HTML / CSS
CSS3中的opacity属性使用教程
Aug 19 HTML / CSS
CSS3中currentColor关键字的妙用
Feb 27 HTML / CSS
简单掌握CSS3中resize属性的用法
Apr 01 HTML / CSS
CSS3实现红包抖动效果
Dec 23 HTML / CSS
HTML5 Canvas实现玫瑰曲线和心形图案的代码实例
Apr 10 HTML / CSS
HTML5 对各个标签的定义与规定:body的介绍
Jun 21 HTML / CSS
html5-Canvas可以在web中绘制各种图形
Dec 26 HTML / CSS
HTML5注册表单的自动聚焦与占位文本示例代码
Jul 19 HTML / CSS
Html5监听手机摇一摇事件的实现
Nov 07 HTML / CSS
微信小程序canvas实现水平、垂直居中效果
Feb 05 HTML / CSS
html5 video全屏播放/自动播放的实现示例
Aug 06 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生成便于打印的网页
2006/10/09 PHP
php iconv() : Detected an illegal character in input string
2010/12/05 PHP
php处理json时中文问题的解决方法
2011/04/12 PHP
php入门学习知识点七 PHP函数的基本应用
2011/07/14 PHP
php结合ACCESS的跨库查询功能
2015/06/12 PHP
PHP实现函数内修改外部变量值的方法示例
2018/12/28 PHP
PHP的PDO预定义常量讲解
2019/01/24 PHP
YII框架页面缓存操作示例
2019/04/29 PHP
laravel 错误处理,接口错误返回json代码
2019/10/25 PHP
js Flash插入函数免激活代码
2009/03/31 Javascript
jquery实现背景墙聚光灯效果示例分享
2014/03/02 Javascript
jquery获取html元素的绝对位置和相对位置的方法
2014/06/20 Javascript
Node.js编码规范
2014/07/14 Javascript
Html5的placeholder属性(IE兼容)实现代码
2014/08/30 Javascript
详解Javascript 装载和执行
2014/11/17 Javascript
js实现键盘控制DIV移动的方法
2015/01/10 Javascript
简单了解JavaScript操作XPath的一些基本方法
2016/06/03 Javascript
最全的Javascript编码规范(推荐)
2016/06/22 Javascript
JavaScript实战(原生range和自定义特效)简单实例
2016/08/21 Javascript
vue+element的表格实现批量删除功能示例代码
2018/08/17 Javascript
vue-cli系列之vue-cli-service整体架构浅析
2019/01/14 Javascript
[28:05]完美世界DOTA2联赛循环赛Inki vs DeMonsTer 第一场 10月30日
2020/10/31 DOTA
用Python进行一些简单的自然语言处理的教程
2015/03/31 Python
Python实现的飞速中文网小说下载脚本
2015/04/23 Python
Python循环语句中else的用法总结
2016/09/11 Python
Python面向对象特殊成员
2017/04/24 Python
python的pytest框架之命令行参数详解(下)
2019/06/27 Python
基于django传递数据到后端的例子
2019/08/16 Python
TensorFlow2.0矩阵与向量的加减乘实例
2020/02/07 Python
Selenium基于PIL实现拼接滚动截图
2020/04/10 Python
35款精致的 CSS3 和 HTML5 网页模板 推荐
2012/08/03 HTML / CSS
以特惠价提供在线奢侈品购物:FRMODA.com
2018/01/25 全球购物
公务员综合考察材料
2014/02/01 职场文书
毕业生学校推荐信范文
2014/05/21 职场文书
卖车协议书范例
2014/09/16 职场文书
linux下安装redis图文详细步骤
2021/12/04 Redis