详解web存储中的storage

web存储之storage

近期工作中使用的数据存储比较多，在工作之余写一篇关于存储的博客来加深自己的印象，希望大家多多批评指正。

一、 web存储分为两种，sessionStorage、localStorage；

二、 web存储的特性；

1.设置、读取方便

2.容量较大，sessionStorage约5M、localStorage约20M

3.可以直接存储字符串，对象存储依靠JSON.stringify() 编码后存储

4.window.sessionStorage

1）生命周期为关闭浏览器窗口
2）在同一个窗口下数据可以共享

5.window.localStorage

1)永久生效，除非手动删除
2)可以实现在同浏览器多窗口共享

三、 web存储的兼容性；   

四、 web存储的字符串操作api（sessionStorage 和 localStorage 操作api相同）

获得本地的存储

window.localStorage.getItem( ‘age' )

在本地存储一个键值对

 window.localStorage.setItem( key，value )

删除本地存储的一个值

window.localStorage.removeItem( key )

清空本地存储

window.localStorage.clear()

获取本地存储的key值

 window.localStorage.key( index )

五、 web存储的对象操作api

1、在本地存储一个对象

window.localStorage.setItem ('socketArr',JSON.stringify( { key:1 } ) );

2、获得本地的存储的对象

JSON.parse(localStorage.getItem ('socketArr') );

如有疑问请留言或者到本站社区交流讨论，感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！

赞 (0)

相关推荐

  • android webview 中localStorage无效的解决方法

    我在 android里面 使用html5的 localStorage 为什么存不进去也读不出来呀? 网上搜了好多都没效果 复制代码 代码如下: mainWebView = (WebView)this.findViewById(R.id.mainWebView);         WebSettings settings = mainWebView.getSettings();         settings.setJavaScriptEnabled(true);         setting

  • HTML5 WebStorage(HTML5本地存储技术)

    HTML5 WebStorage(HTML5本地存储技术)

    WebStorage是HTML5中本地存储的解决方案之一,在HTML5的WebStorage概念引入之前除去IE User Data.Flash Cookie.Google Gears等看名字就不靠谱的解决方案,浏览器兼容的本地存储方案只有使用cookie.有同学可能会问,既然有了cookie本地存储,为什么还要引入WebStorage的概念? Cookie肿么了 cookie的缺陷是非常明显的 1. 数据大小:作为存储容器,cookie的大小限制在4KB左右这是非常坑爹的,尤其对于现在复杂的业

  • android 中 webview 怎么用 localStorage

    我在 android里面 使用html5的 localStorage 为什么存不进去也读不出来呀? 网上搜了好多都没效果 mainWebView = (WebView)this.findViewById(R.id.mainWebView); WebSettings settings = mainWebView.getSettings(); settings.setJavaScriptEnabled(true); settings.setAllowFileAccess(true); setting

  • 移动端使用localStorage缓存Js和css文的方法(web开发)

    移动端使用localStorage缓存Js和css文的方法(web开发)

    将jquery和公共样式缓存到localStorage,可以减少Http请求,从而优化页面加载时间,下面的代码可以实现此功能: <script type="text/javascript"> //入口函数 if (window.localStorage) { initJs(); initCss("css", "/gfdzp201508257998/Turntable/Style/css_whir.css"); } else { add

  • 详解web存储中的storage

    详解web存储中的storage

    web存储之storage 近期工作中使用的数据存储比较多,在工作之余写一篇关于存储的博客来加深自己的印象,希望大家多多批评指正. 一. web存储分为两种,sessionStorage.localStorage: 二. web存储的特性: 1.设置.读取方便 2.容量较大,sessionStorage约5M.localStorage约20M 3.可以直接存储字符串,对象存储依靠JSON.stringify() 编码后存储 4.window.sessionStorage 1)生命周期为关闭浏览器

  • 详解Java分布式系统中session一致性问题

    详解Java分布式系统中session一致性问题

    业务场景 在单机系统中,用户登陆之后,服务端会保存用户的会话信息,只要用户不退出重新登陆,在一段时间内用户可以一直访问该网站,无需重复登陆.用户的信息存在服务端的 session 中,session中可以存放服务端需要的一些用户信息,例如用户ID,所属公司companyId,所属部门deptId等等. 但是随着业务的发展,技术架构需要调整,原来的单机系统逐渐被更换,架构由单机扩展到分布式,甚至当下流行的微服务.虽然在用户端看来系统仍然是一个整体,但在技术端来说业务则被拆分成多个模块,各个模块之间

  • 详解处理Java中的大对象的方法

    详解处理Java中的大对象的方法

    目录 String中的substring 集合大对象扩容 保持合适的对象粒度 Bitmap 把对象变小 数据的冷热分离 数据双写 写入 MQ 分发 使用 Binlog 同步 思维发散 小结 本文我们将讲解一下对于“大对象”的优化.这里的“大对象”,是一个泛化概念,它可能存放在 JVM 中,也可能正在网络上传输,也可能存在于数据库中. 那么为什么大对象会影响我们的应用性能呢? 第一,大对象占用的资源多,垃圾回收器要花一部分精力去对它进行回收: 第二,大对象在不同的设备之间交换,会耗费网络流量,以及

  • 详解IOS开发中生成推送的pem文件

    详解IOS开发中生成推送的pem文件 具体步骤如下: 首先,需要一个pem的证书,该证书需要与开发时签名用的一致. 具体生成pem证书方法如下: 1. 登录到 iPhone Developer Connection Portal(http://developer.apple.com/iphone/manage/overview/index.action )并点击 App IDs 2. 创建一个不使用通配符的 App ID .通配符 ID 不能用于推送通知服务.例如,  com.itotem.ip

  • 详解Http请求中Content-Type讲解以及在Spring MVC中的应用

    详解Http请求中Content-Type讲解以及在Spring MVC中的应用 引言: 在Http请求中,我们每天都在使用Content-type来指定不同格式的请求信息,但是却很少有人去全面了解content-type中允许的值有多少,这里将讲解Content-Type的可用值,以及在spring MVC中如何使用它们来映射请求信息. 1.  Content-Type MediaType,即是Internet Media Type,互联网媒体类型:也叫做MIME类型,在Http协议消息头中,

  • InnoDb 体系架构和特性详解 (Innodb存储引擎读书笔记总结)

    后台线程 •Master Thread 核心后台线程,主要负责将缓冲池的数据异步刷新到磁盘.例如脏页的刷新,插入缓冲的合并,undo 页的回收等. 每秒一次的操作: 1.日志缓冲刷新到磁盘,即使该事务还没有提交.该操作总是会发生,这个就是为了再大的事务,提交时间都很短. 2.当IO压力很小时(1s内发生的IO次数小于5% innodb_io_capacity)合并5% innodb_io_capacity 的插入缓冲. 3.当脏页比例大于 innodb_max_dirty_pages_cnt,

  • 详解java代码中init method和destroy method的三种使用方式

    在java的实际开发过程中,我们可能常常需要使用到init method和destroy method,比如初始化一个对象(bean)后立即初始化(加载)一些数据,在销毁一个对象之前进行垃圾回收等等. 周末对这两个方法进行了一点学习和整理,倒也不是专门为了这两个方法,而是在巩固spring相关知识的时候提到了,然后感觉自己并不是很熟悉这个,便好好的了解一下. 根据特意的去了解后,发现实际上可以有三种方式来实现init method和destroy method. 要用这两个方法,自然先要知道这两

  • 详解在Python中使用Torchmoji将文本转换为表情符号

    很难找到关于如何使用Python使用DeepMoji的教程.我已经尝试了几次,后来又出现了几次错误,于是决定使用替代版本:torchMoji. TorchMoji是DeepMoji的pyTorch实现,可以在这里找到:https://github.com/huggingface/torchMoji 事实上,我还没有找到一个关于如何将文本转换为表情符号的教程.如果你也没找到,那么本文就是一个了. 安装 这些代码并不完全是我的写的,源代码可以在这个链接上找到. pip3 install torch=

  • 详解eclipse项目中.classpath文件的使用

    1 前言 在使用eclipse或者myeclipse进行java项目开发的时候,每个project(工程)下面都会有一个.classpath文件,那么这个文件究竟有什么作用? 2 作用 .classpath文件用于记录项目编译环境的所有信息,包括:源文件路径.编译后class文件存放路径.依赖的jar包路径.运行的容器信息.依赖的外部project等信息.如果把该文件删除,则eclipse不能讲该工程识别为一个正常的java工程,仅仅当做普通的文件夹而导致不能正常运行. 3 .classpath

  • 详解R语言中的表达式、数学公式、特殊符号

    详解R语言中的表达式、数学公式、特殊符号

      在R语言的绘图函数中,如果文本参数是合法的R语言表达式,那么这个表达式就被用Tex类似的规则进行文本格式化. y <- function(x) (exp(-(x^2)/2))/sqrt(2*pi) plot(y, -5, 5, main = expression(f(x) == frac(1,sqrt(2*pi))*e^(-frac(x^2,2))), lwd = 3, col = "blue") library(ggplot2) x <- seq(0, 2*pi, b

随机推荐