介绍两个在客户端存储数据的 API

localStorage与sessionStorage

两个都是window对象的属性,利用这两个属性,可以在客户端存储一些数据

相比cookie,这种存储方式的优点在于能存储更多的数据,且数据不会跟随http协议发送回客户端

localStorage 可以说是永久的存储,存储的数据会一直存在,直到浏览器清除缓存,or 使用JS清除

sessionStorage 顾名思义 存储的数据只在会话中有效 当关闭标签页或者浏览器 存储的数据就会被清除

两种存储方式 只是在存储数据的时间上有所区别,调用都使用了同样的方法

  setItem 接收一个参数,格式"key:value" 类似cookie

  getItem 接收一个key 返回对应的value

  removeItem 接收一个key 删除对应的key和value

  clear 清除所有的数据

对于JS这门语言来讲,这些方法不是必须的,可以使用方括号或者是点号来访问,设置,更新,删除一个key的value

这样更简洁

博客园的localStorage

  你在博客园写博客的时候,也可以看看当前页面的localStorage,里面也保存了你写的博客

  一个属性是draftBody保存了你在编辑器中打出的文字和HTML代码

  draftTitle保存文章的标题

客户端存储 API的更多相关文章

  1. js-新兴的API,最佳实践,离线应用于客户端存储

    离线应用于客户端存储: 1.离线检测:online以及offline事件,都是在window对象上触发 navigator.online为true的时候是表示设备能够上网 2.使用一个描述文件(man ...

  2. JavaScript的客户端存储

    一.前言: 客户端存储实际上就是Web浏览器的记忆功能,通过浏览器的API实现数据存储到硬盘: 二.存储的不同形式: 1.Web存储:localStorage 和 sessionStorage 代表同 ...

  3. js023-离线应用与客户端存储

    js023-离线应用与客户端存储 本章内容: 进行离线检测 使用离线缓存 在浏览器中保存数据 23.1 离线检测 第一步:知道设备是在线还是离线:navigator.Online属性.该值为true表 ...

  4. Web - 客户端存储的几种方式

    客户端存储主要方便一些APP离线使用.今天就来说说客户端存储的方法有多少? 说在最前面的一句:所有的客户端存储都有一个原则:读写的数据必须要同域 1 Cookie Cookie是一项很老的技术的,就是 ...

  5. 《javascript高级程序设计》 第23章 离线应用与客户端存储

    23.1 离线检测23.2 应用缓存23.3 数据存储 23.3.1 Cookie 23.3.2 IE 用户数据 23.3.3 Web 存储机制 23.3.4 IndexedDB   23.1 离线检 ...

  6. HTML5 客户端存储数据的两种方式

    HTML5 提供了两种在客户端存储数据的新方法: localStorage - 没有时间限制的数据存储 sessionStorage - 针对一个 session 的数据存储 之前,这些都是由 coo ...

  7. 动画优化、客户端存储、历史记录、worker

    一.requestAnimationFrame 1.requestAnimationFrame怎么用? 设置关键帧动画效果,注重关键帧执行的情况,用法与setTimeout一样 2.requestAn ...

  8. 离线应用与客户端存储(cookie storage indexedDB)

    离线检测 HTML5定义一个属性:navigator.onLine的属性.这个属性值为true,表示设备在线,值为false,表示设备离线.为了更好的确定网络是否可用,HTML5还定义了两个事件.这两 ...

  9. 《JavaScript》web客户端存储

    Web存储: 兼容IE8在内的所有主流浏览器,不兼容早期浏览器:支持大容量但非无限量 LocalStorage和sessionStorage是window对象的两个属性,这两个属性都代表同一个stor ...

随机推荐

  1. 将1、2、3、……、n这n个连续自然数分成g组,使每组的和相等。g组中个数最多的一组有几个?

    <style type="text/css"> #content { width: 600px; margin: 150px auto 0 auto; } dl dd ...

  2. C++迭代器 iterator【转】

    1. 迭代器(iterator)是一中检查容器内元素并遍历元素的数据类型.(1) 每种容器类型都定义了自己的迭代器类型,如vector:vector<int>::iterator iter ...

  3. z-index用法总结

    一.定义: z-index 只适用于元素有定位的情况,表示层级 数值越大 层级越高 展示的位置越靠前. 二.用法: 1.同级关系: z-index值较大的元素将叠加在z-index值较小的元素之上 ( ...

  4. Angular.js学习笔记 (一)

    - angular中最重要的概念是指令(directive)- ng-model 是双向数据绑定的指令,效果就是将当前元素的value属性和模型中的[user.name]建立绑定关系### 模块(Mo ...

  5. Mysql安装设置建议(参数设置)

    当我们监测MySQL性能时,人们希望我们能够检视一下MySQL配置然后给出一些提高建议.许多人在事后都非常惊讶,因为我们建议他们仅仅改动几个设置,即使是这里有好几百个配置项.这篇文章的目的在于给你一份 ...

  6. js 不要使用new

    (1)不要使用new Array(),new Number, new String, or new Boolean. 等等 如果要新建数组,没有必要使用new Array(),使用[];原因是直观. ...

  7. nodejs + nginx + ECS阿里云服务器环境设置

    nodejs + nginx + ECS阿里云服务器环境设置 部署 nodejs ECS 基于 CentOS7.2 详细步骤:click 部署 nginx 安装 添加Nginx软件库: [root@l ...

  8. iOS获取设备型号和App版本号等信息(OC+Swift)

    iOS获取设备型号和App版本号等信息(OC+Swift) 字数1687 阅读382 评论3 喜欢10 好久没有写过博客了,因为中间工作比较忙,然后有些个人事情所以耽误了.但是之前写的博客还一直有人来 ...

  9. GitHub上非常受开发者欢迎的iOS开源项目(二)

    "每一次的改变总意味着新的开始."这句话用在iOS上可谓是再合适不过的了.GitHub上的iOS开源项目数不胜数,iOS每一次的改变,总会引发iOS开源项目的演变,从iOS 1.x ...

  10. while循环语句的几种方式

    我们知道,在Python中经常我们要使用循环,其中最常用的是while循环,while有很多结合方式,我们知道,如果一个循环没有结束语句那么就失去了意义,所以我们一定要有结束语句,下面来看看while ...