1.突破cookie 4K限制,一般浏览器支持5M

2.增 删 改 查

  

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body> <script type="text/javascript">
window.onload=function(){ if(!window.localStorage){
alert("浏览器不支持localstorage");
return false;
}else{
var storage=window.localStorage;
//写入a字段--增或改
storage["a"]=1;
//写入b字段--增或改
storage.b=1;
//写入c字段 --增或改
storage.setItem("c",3);
//删除c
storage.removeItem('c');
//清空storage
//storage.clear();
//查询
console.log('a:',storage.getItem('a'));
storage.a;
storage["a"];
console.log(typeof storage["a"]);
console.log(typeof storage["b"]);
console.log(typeof storage["c"]);
}
}
</script>
</body> </html>

增删改查

3.遍历localStorage

var storage=window.localStorage;
storage.a=1;
storage.setItem("c",3);
for(var i=0;i<storage.length;i++){
var key=storage.key(i);
console.log(key);
}

4.存储为字符串

  JSON.stringify() # json对象转为json字符串

  JSON.parse() # json字符串转为json对象

前端本地存储localStorage的更多相关文章

  1. 移动端浏览器隐私模式/无痕模式使用本地存储localStorage/sessionStorage的问题

    移动端浏览器隐私模式/无痕模式使用本地存储localStorage/sessionStorage的问题 开发H5 webapp时经常需要使用本地存储,如localStorage和sessionStor ...

  2. html5的本地存储localStorage和sessionStorage

    html5的本地存储localStorage和sessionStorage html5中新增的比较重要的一个功能就是web storage来实现客户端本地存储数据,之前存储数据都是用cookie来实现 ...

  3. 本地存储localStorage sessionStorage 以及 session 和cookie的对比和使用

    cookie和session都是用来跟踪浏览器用户身份的会话方式. 1.验证当前服务中继续请求数据时,哪些缓存数据会随着发往服务器? 只有cookie中设置的缓存数据会发送到服务器端 2. 强调几点: ...

  4. 本地存储localStorage以及它的封装接口store.js的使用

    本地存储localStorage以及它的封装接口store.js的使用 sublime-text chrome javascript readyGo 2016年11月20日发布   0 推荐 9 收藏 ...

  5. 本地存储 localStorage

    本地存储localStorage 概念:window对象下面的属性,html5新增的,将5M大小的数据存储本地的浏览器上面. 浏览器支持存储5M大小 本地存储localStorage特点 本地存储属于 ...

  6. 本地存储 localStorage/sessionStorage/cookie

    cookie是个基础的东西.是服务器发送到客户端,存储在客户端的一小段数据.可以存储一些配置信息,客户标识信息等.用户下次访问这个网站时,会把上次网站发来的cookie一同发送回去.cookie保存在 ...

  7. HTML5本地存储 localStorage

    HTML5的本地存储是大势所趋,如果仅存储在内存中,则是sessionStorage,他们的语法都是一样,仅仅是一个存储在本地文件系统中,另一个存储在内存中(随着浏览器的关闭而消失),其语句如下: l ...

  8. web本地存储localStorage和sessionStorage

    用谷歌浏览器调试网页程序时候发现有一个这个栏目 记录本地存储的相关信息(cookie,sessionStorage,LocalStorage等)的存储信息 1.LocalStorage localst ...

  9. HTML5 学习笔记(三)——本地存储(LocalStorage、SessionStorage、Web SQL Database)

    一.HTML4客户端存储 B/S架构的应用大量的信息存储在服务器端,客户端通过请求响应的方式从服务器获得数据,这样集中存储也会给服务器带来相应的压力,有些数据可以直接存储在客户端,传统的Web技术中会 ...

随机推荐

  1. bootstrap简单使用布局、栅格系统、modal标签页等常用组件入门

    <!DOCTYPE html> <html> <head> <title>bootstrap</title> <!-- 引入boots ...

  2. 更新ocr voting后第二个节点启动不起来

    [+ASM2]@qdcx-db2[/home/grid]$crsctl check crs CRS-4638: Oracle High Availability Services is online ...

  3. 单点登录SSO的原理及实现方式总结

      核心思想   用户信息的集中存储(全局Cooike.集中式Session.Json Web Token.Redis缓存服务器.自定义SSO服务器)   认证(Filter中执行)   登出(不同站 ...

  4. vue入手

    https://www.jianshu.com/p/dc5057e7ad0d    (最全入坑教程) http://doc.liangxinghua.com/vue-family/1.4.html(v ...

  5. Oauth2.0 QQ&微信&微博实现第三方登陆

    一.写在前面 目前对于大多数的App或Web网站都支持有第三方登陆这个功能,用户可使用 QQ/ 微信/ 微博 帐号快速登录你的网站,降低注册门槛,为你的网站带来海量新用户.最近在新项目上刚好用到了,在 ...

  6. Confluence 6 使用 Fail2Ban 来限制登录尝试

    什么是 Fail2Ban? 我们需要在我们网站中防止密码的暴利破解.Fail2Ban 是一个 Python 的应用来查看日志文件,使用的是正则表达式,同时还可以与Shorewall (或者 iptab ...

  7. Confluence 6 编辑站点欢迎消息使用模板编辑器的小提示

    站点欢迎消息是一个模板而不是一个页面,所以你需要使用模板编辑器来对你的消息进行编辑. 你可以和在你 Confluence 中其他页面中一样,在站点欢迎消息模板中添加文本,连接和宏.但是添加图片的话会有 ...

  8. flask 面试题

    1,什么是Flask,有什么优点?概念解释Flask是一个Web框架,就是提供一个工具,库和技术来允许你构建一个Web应用程序.这个Web应用程序可以是一些Web页面,博客,wiki,基于Web的日里 ...

  9. 基于多进程的Tcp套接字服务器

    服务端 import socketfrom multiprocessing import Process def task(c): print('顾客吃点啥') while True: data = ...

  10. 《剑指offer》 调整数组顺序使得奇数在偶数前面

    本题来自<剑指offer> 调整数组顺序使得奇数在偶数前面 题目: 输入一个整数数组,实现一个函数来调整该数组中数字的顺序,使得所有的奇数位于数组的前半部分,所有的偶数位于数组的后半部分, ...