LocalStorage存储
1.localStorage存储服务:
.factory('storageSvc', [function () {
return {
//保存数据
save: function (key, value) {
window.localStorage.setItem(key, value);
},
//读取数据
load: function (key) {
return window.localStorage.getItem(key);
},
//删除单个数据
delete: function (key) {
window.localStorage.removeItem(key);
},
//删除所有数据
deleteAll: function () {
window.localStorage.clear();
},
//得到某个索引的key
getIndexKey: function (index) {
window.localStorage.key(index);
}
}
}]);
2.localStorage 存储方案
localstoage保存的数据,是以key / value的形式存储的。value是一个字符串,因此如果要保存多个数据,有以下处理方式:
一. 使用多个key/value组合,每一个输入框的key都不一样,这样相互之间就不会有影响,就可以保存和获取多个值.
二.将一系列输入框内容保存在同一个key下面,那么对value的形式就需要做一些特殊的处理,一般来说分为两种处理方式:
1. 使用分隔符,例如 value1|value2|value3,使用竖线分割,读取出来后再使用竖线拆分。这种方式优点是是简单,缺点是对保存的顺序有要求。你必须知道第一个是代表什么,第二个是代表什么。
2. 使用序列化的对象,例如要将一些值存到一个对象,再将对象转换为字符串存到localstorage,就像这样:"{key1: 'value1', key2: 'value2'}"。然后读取数据的时候,将字符串再转成对象。这样做的优点是结构清晰,维护方便;缺点是相对麻烦点,且效率相对第1种要低,因为毕竟要做一些序列化和反序列化的操作。
3.在将对象保存为JSON格式前,需要将对象序列化为JSON字符串以及将JSON字符串反序列化为对象。
参考文章:
2.Quick tip: using HTML5 localstorage to store JSON objects on a device in your PhoneGap app
6.Creating a CRUD form with HTML5 Local Storage and JSON
9.Storing Objects in HTML5 localStorage
11.Js 基于html5-localStorage方法 制作的 "我的便签本"
12.使用 jQuery Mobile 与 HTML5 开发 Web App —— HTML5 Web Storage
13.CRUD operations with local storage as a database
LocalStorage存储的更多相关文章
- 使用sessionStorage、localStorage存储数组与对象(转)
http://my.oschina.net/crazymus/blog/371757 使用sessionStorage.localStorage存储数组与对象 发表于3个月前(2015-01-26 1 ...
- AngularJS进阶(二十九)AngularJS项目开发技巧之localStorage存储
AngularJS项目开发技巧之localStorage存储 注: localStorage深度学习 绪 项目开发完毕,测试阶段发现后台管理端二维码生成有问题,问题在于localStora ...
- 使用sessionStorage、localStorage存储数组与对象
先介绍一下localStorage localStorage对象是HTML5的客户端存储持久化数据的方案.为了能访问到同一个localStorage对象,页面必须来自同一个域名(子域名无效),使用同一 ...
- localStorage存储对象,sessionStorage存储数组对象
前言 最近在用angular做商城购物车的功能模块,因为angular的watch监听,数据只要发生变化就能很方便的自动渲染页面.但随即出现的问题是,之前用户操作的样式都会被重置掉. 例如我勾选了几个 ...
- localStorage存储数组,对象,localStorage,sessionStorage存储数组对象
localStorage存储数组,对象,localStorage,sessionStorage存储数组对象 前言 最近在用angular做商城购物车的功能模块,因为angular的watch监听, ...
- LocalStorage存储JSON对象的问题
LocalStorage存储JSON对象的问题 localStorage - 没有时间限制的数据存储 1 var arr=[1,2,3]; 2 localStorage.setItem(" ...
- localstorage存储对象
之前在客户端存储数据一直用的是cookie,由于有大小等限制,随着html5时代的到来,现在大多数用的是localstorage存储数据: 例如: localStorage.setItem(" ...
- HTML5 WEB Storage - localStorage存储位置在哪
localStorage作为客户端浏览器持久化存储方案 这个是浏览器隔离的,每个浏览器都会把localStorage存储在自己的UserData中,如chrome一般就是 C:\Users\你的计算机 ...
- Android WebView js混合cookie和localStorage存储
一.cookie存储和取出: (1)存储: ------------------- **在loadURL之前调用** -------------------- /** * 同步一下cookie */ ...
随机推荐
- 关于Makefile.am中与Build相关的变量设置 AM_CPPFLAGS
http://tonybai.com/2010/10/26/about-variables-related-to-building-in-makefile-am/ 关于Makefile.am中与Bui ...
- Windows系统的安装
一.写在前面 笔者最近因为换工作,在家待业甚感无聊,于是想要整理一些在Windows系统的一些安装方法和下载资源,一来给自己做个备忘,二来把一些不成熟的想法分享出去,希望大家予以指正. ...
- 一个利用Dataflow实现的Actor
最近进行并发数据处理,学习到了 Actor模型,其中最简单的实现方式是一位大牛利用Dataflow实现的. 大牛的方案:http://www.jayway.com/2013/11/15/an-acto ...
- linux下的gdb调试工具--内存调试
接着上一节的代码,在while(1)的循环里面增加代码:sum=0 #include <stdio.h> int main(void) { int sum = 0, i = 0; char ...
- PCL点云库增加自定义数据类型
#include <pcl/filters/passthrough.h> #include <pcl/filters/impl/passthrough.hpp> // the ...
- Android_实现静默安装和卸载应用
转:http://www.cnblogs.com/ondream/archive/2012/04/13/2446138.html 前段时间做了一个批量安装卸载应用程序的小应用,由于安装卸载应用程序的部 ...
- Java Notes 00 - Singleton Pattern(单例总结)
转:http://hukai.me/java-notes-singleton-pattern/ 这里不赘述单例模式的概念了,直接演示几种不同的实现方式. 0)Eager initialization ...
- webpack 多入口配置
同事套搭建vue项目,个人推荐了VUE官网的vue-cil的方式,http://cn.vuejs.org/guide/application.html 顺着官网的操作,我们可以本地测试起我们的项目 n ...
- Springmvc加载静态文件和开启EL表达式的支持
一.静态文件加载问题 刚开始学习SpringMVC,发现静态文件无法加载 web.xml配置如下: <web-app id="WebApp_ID" version=" ...
- hdu 5755 Gambler Bo 高斯消元
题目链接 给n*m的方格, 每个格子有值{0, 1, 2}. 然后可以对格子进行操作, 如果选择了一个格子, 那么这个格子的值+2, 这个格子上下左右的格子+1, 并且模3. 问你将所有格子变成0的操 ...