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. maven本地添加Oracle包

    因为版权原因,Java后台连接数据库的ojdbc包并不可以用maven直接从网上下载导入,所以需要我们手动将其资源放在本地.下面是步骤: 1.找到Oracle ojdbc6包,拷贝到某备份目录2.包目 ...

  2. Windows10系统配置telnet服务的方法

    通常情况下,Windows10正式版系统的telnet服务都是处于关闭状态的,需要我们手动开启才可以.telnet服务可以调试端口,其重要性不容小视.今天,系统城小编就教大家如何配置telnet服务. ...

  3. Python经典算法-快速幂

    快速幂 问题描述: 计算a ** n % b 其中a.b和n都是32位的非负整数 即求a的n次方对b的余数 问题示例: 例如:2**31%3=2 --- 代码实现如下 class Solution: ...

  4. 在Anaconda3下安装(CPU版)TensorFlow(清华镜像源)

    1.打开Anaconda Prompt 2.搭建TensorFlow的环境: conda config --add channels https://mirrors.tuna.tsinghua.edu ...

  5. 理解和运用Java中的Lambda

    前提 回想一下,JDK8是2014年发布正式版的,到现在为(2020-02-08)止已经过去了5年多.JDK8引入的两个比较强大的新特性是Lambda表达式(下文的Lambda特指JDK提供的Lamb ...

  6. 如何准备Java面试?如何把面试官的提问引导到自己准备好的范围内?

    Java能力和面试能力,这是两个方面的技能,可以这样说,如果不准备,一些大神或许也能通过面试,但能力和工资有可能被低估.再仔细分析下原因,面试中问的问题,虽然在职位介绍里已经给出了范围,但针对每个点, ...

  7. 红帽RedHat 8.0新特性(网络、yum源、Web界面管理等)

    1.Red Hat8 配置静态IP 注意:Red Hat8网络管理默认使用NetworkManager,而不是之前版本的network. 按照之前版本我们一般通过配置文件设置静态IP地址信息,如下: ...

  8. C语言实现银行家算法

    #include <stdio.h> #include <stdlib.h> #include <string.h> #include <stdbool.h& ...

  9. python 存储数据

    如何进行数据存储,很多程序都要求用户输入某种信息,如让用户存储游戏首选项或提供要可视化的数据. 使用模块json进行数据存储. 1.1.使用json.dump()和json.load() #-*- e ...

  10. HDU_1494_dp

    http://acm.hdu.edu.cn/showproblem.php?pid=1494 能量用0-14表示,dp[i][j]表示走到第i段,所剩能量j的最小时间. #include<ios ...