H5 js 处理localstorage方法封装
李说:
(已验证,可以直接用于开发中。)
在移动端开发中,我们未来将一根页面的数据带到另外一个页面中,需要将数据临时存放到缓存中,这时我们就用到了localstorage,相当于pc端的cookie和服务器的session一样。
<script>
/*
存储localstorage时候最好是封装一个自己的键值,在这个值里存储自己的内容对象,
封装一个方法针对自己对象进行操作。避免冲突也会在开发中更方便。
*/
var mystorage = (function mystorage(){
var ms = "mystorage";
var storage=window.localStorage;
if(!window.localStorage){
alert("浏览器不支持localstorage");
return false;
}
var set = function(key,value){
//存储
var mydata = storage.getItem(ms);
if(!mydata){
this.init();
mydata = storage.getItem(ms);
}
mydata = JSON.parse(mydata);
mydata.data[key] = value;
storage.setItem(ms,JSON.stringify(mydata));
return mydata.data;
};
var get = function(key){
//读取
var mydata = storage.getItem(ms);
if(!mydata){
return false;
}
mydata = JSON.parse(mydata);
return mydata.data[key];
};
var remove = function(key){
//读取
var mydata = storage.getItem(ms);
if(!mydata){
return false;
}
mydata = JSON.parse(mydata);
delete mydata.data[key];
storage.setItem(ms,JSON.stringify(mydata));
return mydata.data;
};
var clear = function(){
//清除对象
storage.removeItem(ms);
};
var init = function(){
storage.setItem(ms,'{"data":{}}');
};
return {
set : set,
get : get,
remove : remove,
init : init,
clear : clear
};
})();
console.log(mystorage.set('tqtest','tqtestcontent'));//存储
console.log(mystorage.set('aa','123'));//存储
console.log(mystorage.set('tqtest1','tqtestcontent1'));//存储
console.log(mystorage.set('tqtest1','newtqtestcontent1'));//修改
console.log(mystorage.get('tqtest'));//读取
console.log(mystorage.remove('tqtest'));//删除
mystorage.clear();//整体清除
</script>
转载至:http://blog.csdn.net/guo8ke/article/details/70846743
转载于:https://blog.51cto.com/jianboli/1974605
H5 js 处理localstorage方法封装相关推荐
- 原生js时间格式化方法封装
原生js时间格式化方法封装 创建formatDate函数,传入date(时间)和format(格式)两个参数,简单判断format返回相应格式的时间 注意:getMonth()方法获取到的月份会比实际 ...
- JS深拷贝对象方法封装
JS深拷贝对象f 代码如下(示例): export function deepCopy(obj) {var objClone = Array.isArray(obj) ? [] : {};if (ob ...
- 数据本地存储方法封装(笔记)localStorage、sessionStorage
数据本地存储方法封装(笔记)localStorage.sessionStorage 方法: import storage from 'good-storage'const SELLER_KEY = ' ...
- Atitit.提升软件Web应用程序 app性能的方法原理 h5 js java c# php python android .net
Atitit.提升软件Web应用程序 app性能的方法原理 h5 js java c# php python android .net 1. 提升单例有能力的1 2. 减少工作数量2 2.1. 减少距 ...
- common.js 通用方法封装
/*** 通用方法封装处理** Created by on 2018/9/7*/ (function ($) {var $table = $('#table');$.extend({/*** 表格封装 ...
- js获取url 参数方法封装
js获取url 参数方法封装 // 获取url 参数getUrlParam(params) {let url = location.href;url = url.replace("?&quo ...
- vue js 工具方法封装js 文件
首先写一个js 文件 export defalt **api const envYml = {/*** 创建配置 yml configMap 操作*/test: () => {console.l ...
- JS使用localStorage缓存Js和css文件
代码下载: http://download.csdn.net/download/qq_29132907/10261798 目录结构 将jquery和公共样式缓存到localStorage,可以减少Ht ...
- 利用ES6-Promise()方法封装原始jsonp实现跨域请求公用方法(告别使用JQuery封装好的jsonp)
在项目中,经常需要用到jsonp实现跨域请求,假如使用JQuery封装好的jsonp方法,是很容易实现的,缺点:需要引入JQuery库. $.ajax({url : './package.json', ...
最新文章
- 和达摩院深度绑定,阿里云下一个十年,成为“云上的阿里巴巴”
- 求方程ax2+bx+c的根python_Python,计算 ax^2 + bx + c = 0的根
- k型热电偶分度表_一张表搞定热电偶与热电阻的问题
- 【题解】luogu p1156 垃圾陷阱
- C#生成PDF文件中时,设置边框为虚线和隐藏显示单个或者多个边框。
- sum服务器操作系统,SUM服务器监控软件
- 《JavaScript面向对象精要》——1.2 原始类型
- 1、XML 简介,2、JSON 教程
- 基于深度学习的单目图像深度估计
- Jupyter Notebook Virtualenv 添加 卸载环境
- dedecms分页样式修改 内容页 上一页 下一页
- 软考网络工程师重难点总结分享~(3)
- 数学笔记30——无穷级数和收敛判定
- html img 能显示psd吗_psd变成html
- 公众号内测算法推荐引争议,却有小号因此阅读增长20倍
- 【中级计量经济学】Lecture 3 非球形扰动
- 提高社会的微生物素养:势在必行!
- java 拼音转汉字_用Java转化汉字为拼音全拼
- 定时器软件RH Timer for Mac了解一下
- 海思NNIE开发(一):海思Hi3559AV100/Hi3519AV100 NNIE深度学习模块开发与调试记录
热门文章
- 华为余承东鸿蒙系统随时可以上线,华为发布鸿蒙系统,余承东称随时可替换安卓...
- python selenium 进入新标签页_python 爬虫之selenium可视化爬虫
- realvnc 6 教程 linux,CentOS 6下VNC的安装与配置
- html跨域post请求,使用fetch跨域POST请求
- php全选帖子删除,用PHP实现全选全删
- Java案例:接口的静态方法
- 【codevs1001】舒适的路线,心累的冰茶几
- html5json转换为数组,将JSON数组转换为jQuery中的HTML表
- linux内核源码只有makefile文件没有c文件,linux内核代码的编写初步以及makefile的配置...
- java怎么实现查找n功能_java 实现微信搜索附近人功能