localStorage 的优势

  • localStorage 拓展了 cookie 的 4K 限制。
  • localStorage 会可以将第一次请求的数据直接存储到本地,这个相当于一个 5M 大小的针对于前端页面的数据库,相比于 cookie 可以节约带宽,但是这个却是只有在高版本的浏览器中才支持的。

localStorage 的局限

  • 浏览器的大小不统一,并且在 IE8 以上的 IE 版本才支持 localStorage 这个属性。
  • 目前所有的浏览器中都会把localStorage的值类型限定为string类型,这个在对我们日常比较常见的JSON对象类型需要一些转换。
  • localStorage在浏览器的隐私模式下面是不可读取的。
  • localStorage本质上是对字符串的读取,如果存储内容多的话会消耗内存空间,会导致页面变卡。
  • localStorage不能被爬虫抓取到。

localStorage 与 sessionStorage 区别

  localStorage 与 sessionStorage 的唯一一点区别就是 localStorage 属于永久性存储,而 sessionStorage 属于当会话结束的时候,sessionStorage 中的键值对会被清空。

localStorage 作用域

  localStorage只要在相同的协议、相同的主机名、相同的端口下,就能读取/修改到同一份localStorage数据。

  1. 由于域名不同,不能进行共享。
  2. 二个webview相当于同一个浏览器的不同标签页。所以可以共享。

写入方法:

localStorage.setItem('item1', 'C#')

localStorage['item2'] = 'Java'

localStorage.item3 = 'PHP'

读取方法:

localStorage.getItem('item1')

localStorage["item2"]

localStorage.item3

清除某个元素:

localStorage.removeItem('item1')

清除所有元素:

localStorage.clear()

获取某个位置对应的键值:

localStorage.key(0)

参考:

https://segmentfault.com/a/1190000018954001

https://www.runoob.com/jsref/prop-win-localstorage.html

localStorage 存储的更多相关文章

  1. 使用sessionStorage、localStorage存储数组与对象(转)

    http://my.oschina.net/crazymus/blog/371757 使用sessionStorage.localStorage存储数组与对象 发表于3个月前(2015-01-26 1 ...

  2. LocalStorage存储

     1.localStorage存储服务: .factory('storageSvc', [function () { return { //保存数据 save: function (key, valu ...

  3. AngularJS进阶(二十九)AngularJS项目开发技巧之localStorage存储

    AngularJS项目开发技巧之localStorage存储       注: localStorage深度学习 绪 项目开发完毕,测试阶段发现后台管理端二维码生成有问题,问题在于localStora ...

  4. 使用sessionStorage、localStorage存储数组与对象

    先介绍一下localStorage localStorage对象是HTML5的客户端存储持久化数据的方案.为了能访问到同一个localStorage对象,页面必须来自同一个域名(子域名无效),使用同一 ...

  5. localStorage存储对象,sessionStorage存储数组对象

    前言 最近在用angular做商城购物车的功能模块,因为angular的watch监听,数据只要发生变化就能很方便的自动渲染页面.但随即出现的问题是,之前用户操作的样式都会被重置掉. 例如我勾选了几个 ...

  6. localStorage存储数组,对象,localStorage,sessionStorage存储数组对象

    localStorage存储数组,对象,localStorage,sessionStorage存储数组对象   前言 最近在用angular做商城购物车的功能模块,因为angular的watch监听, ...

  7. LocalStorage存储JSON对象的问题

    LocalStorage存储JSON对象的问题   localStorage - 没有时间限制的数据存储 1 var arr=[1,2,3]; 2 localStorage.setItem(" ...

  8. localstorage存储对象

    之前在客户端存储数据一直用的是cookie,由于有大小等限制,随着html5时代的到来,现在大多数用的是localstorage存储数据: 例如: localStorage.setItem(" ...

  9. HTML5 WEB Storage - localStorage存储位置在哪

    localStorage作为客户端浏览器持久化存储方案 这个是浏览器隔离的,每个浏览器都会把localStorage存储在自己的UserData中,如chrome一般就是 C:\Users\你的计算机 ...

  10. Android WebView js混合cookie和localStorage存储

    一.cookie存储和取出: (1)存储: ------------------- **在loadURL之前调用** -------------------- /** * 同步一下cookie */ ...

随机推荐

  1. THUWC2020 自闭记

    DAY 1 报道 领胸牌和-围巾-! 发现我和 \(ssf\) 小姐姐一个考场. 合影+开幕式 宾馆睡了一觉-睡上午觉真的舒服. 合影时在c位! 开幕式.比上次夏令营不知道好到哪里去了,讲话都挺有意思 ...

  2. Python3之MySQL操作

    1.安装pymysql PyMySQL 是在 Python3.x 版本中用于连接 MySQL 服务器的一个库,在使用之前需要进行安装,可以使用以下命令安装最新版的 PyMySQL: 1).在cmd命令 ...

  3. [CCPC2019 ONLINE]H Fishing Master

    题意 http://acm.hdu.edu.cn/showproblem.php?pid=6709 思考 先考虑所有鱼的烹饪时间小于k的情况.将T从大到小排序后,煮一条鱼相当于将其时间补齐至k. 由于 ...

  4. 理想乡题解 (线段树优化dp)

    题面 思路概述 首先,不难想到本题可以用动态规划来解,这里就省略是如何想到动态规划的了. 转移方程 f[i]=min(f[j]+1)(max(i-m,0)<=j<i 且j符合士兵限定) 注 ...

  5. 机器学习-浅谈神经网络和Keras的应用

    概述 神经网络是深度学习的基础,它在人工智能中有着非常广泛的应用,它既可以应用于咱们前面的章节所说的Linear Regression, classification等问题,它还广泛的应用于image ...

  6. 《ASP.NET Core 高性能系列》ASP.NET Core的启动过程(1)

    一.一切从头开始 简述:知道事情的真相就应该从头 开始,下面我们代码先行 public class Program { public static void Main(string[] args) { ...

  7. try catch finally的理解

    定义以及用法: try/catch/finally 语句用于处理代码中可能出现的错误信息. 错误可能是语法错误,通常是程序员造成的编码错误或错别字.也可能是拼写错误或语言中缺少的功能(可能由于浏览器差 ...

  8. Linux防火墙之iptables基本匹配条件和隐式扩展匹配条件

    一.iptables的基本匹配条件 上一篇博文我们说到了iptables的基本工作原理.数据报文在内核的走向和管理链.管理规则.以及查看规则.导入和导出规则:回顾请参考https://www.cnbl ...

  9. Java支付宝PC网站支付功能开发(详细教程)

    一.前言 本案例使用的是Java实现的.使用支付宝的沙盒环境示例.发布需要换成正式环境.这里就不作详细说明了 本代码适合用来做参考,不要直接复制去使用. 没有账号的需要去平台注册一个: 登录支付宝开发 ...

  10. Java 设置Excel自适应行高、列宽

    在excel中,可通过设置自适应行高或列宽自动排版,是一种比较常用的快速调整表格整体布局的方法.设置自适应时,可考虑2种情况: 1.固定数据,设置行高.列宽自适应数据(常见的设置自适应方法) 2.固定 ...