LocalStorage是HTML5 提供的在客户端存储数据的方法。替代但不同于之前的globalStorage,规则作用范围事先已设定好,是同一个域名(子域无效),使用同一种协议,在同一个端口上。
目前主流的较新版浏览器除IE8以下的以外都支持localstorage。
localStorage 方法存储的数据没有时间限制,除非主动删除,否则永久有效。目前仅支持字符串数据的存取。

localStorage是属于Storage的实例,Storage接口如下:

 interface Storage {
readonly attribute unsigned long length;
DOMString? key(unsigned long index);
getter DOMString getItem(DOMString key);
setter creator void setItem(DOMString key, DOMString value);
deleter void removeItem(DOMString key);
void clear();
};

通过接口可知,Storage实例具有的方法有:

key(index): 在指定的数字位置获取该位置的名字(key)。
getItem(key): 根据指定的名称key获取对应的值。
setItem(key, value): 设置名称key对应的值value。
removeItem(key): 删除名称key对应的名-值对。
clear(): 删除所有值。

另外还有length属性可以获取存储的key-value数量。
读取和设置数据还可以使用点属性名的方式,如
localStorage.name = "test";
var name = localStorage.name; //name = "test"
delete localStorage.name; //删除
虽然如此,但是建议使用接口规范的方法操作。getItem、setItem、removeItem
代码示例1:

 if(window.localStorage){
window.localStorage.setItem("name","test-OK");//存
var name = window.localStorage.getItem("name");//取
window.localStorage.removeItem("name");//删
}else{
throw "LocalStorage not available.";
}

对于只支持globalStorage的浏览器,localStorage可用globalStorage[location.host];


参考资料:
《JavaScript高级程序设计(第二版)》 第19章 客户端存储
http://www.w3.org/TR/webstorage/ W3C Web Storage

web本地存储-LocalStorage的更多相关文章

  1. web本地存储localStorage和sessionStorage

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

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

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

  3. web 本地存储 (localStorage、sessionStorage)

    web 本地存储 (localStorage.sessionStorage,cookie) localStorage(长期储存):即使关闭浏览器数据也不会删除,除非使用localStorage.cle ...

  4. [web 前端] web本地存储(localStorage、sessionStorage)

    cp from : https://blog.csdn.net/mjzhang1993/article/details/70820868 web 本地存储 (localStorage.sessionS ...

  5. web本地存储(localStorage、sessionStorage)

    web 本地存储 (localStorage.sessionStorage) 说明 对浏览器来说,使用 Web Storage 存储键值对比存储 Cookie 方式更直观,而且容量更大,它包含两种:l ...

  6. 本地存储 localStorage/sessionStorage/cookie

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

  7. html5的本地存储localStorage和sessionStorage

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

  8. web本地存储

    Web本地存储 通过本地存储(Local Storage),web 应用程序能够在用户浏览器中对数据进行本地的存储. 在 HTML5 之前,应用程序数据只能存储在 cookie 中,包括每个服务器请求 ...

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

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

随机推荐

  1. 转——iptables详细配置

    基本原理及命令使用  http://my.oschina.net/hevakelcj/blog/313212 基础知识 Linux系统内核内建了netfilter防火墙机制.Netfilter(数据包 ...

  2. 高性能WEB开发 为什么要减少请求数,如何减少请求数!

    http请求头的数据量 [声明] 转载  原文出处:http://www.blogjava.net/BearRui/. 谢谢我们先分析下请求头,看看每次请求都带了那些额外的数据.下面是监控的googl ...

  3. 恶补ASP.NET基础【1】委托

    委托(delegate)是一种可以把引用存储为函数的类型. 委托的声明类似于函数,但不带函数体,且要使用delegate关键字,委托的声明指定了一个返回类型和一个参数列表. 在定义了委托之后,就可以声 ...

  4. TCP协议: SYN ACK FIN RST PSH URG 详解

    TCP的三次握手是怎么进行的了:发送端发送一个SYN=1,ACK=0标志的数据包给接收端,请求进行连接,这是第一次握手:接收端收到请求并且允许连接的话,就会发送一个SYN=1,ACK=1标志的数据包给 ...

  5. 環氧樹脂對COB的影響

    COB的封膠一般使用單液 Epoxy(環氧樹脂),也可以使用雙液(Epoxy+硬化劑),雙液的成品品質可靠度雖然比較高,但是保存及維護非常麻煩,所以一般的 COB 都還是採用單液的製程. 其次是如何控 ...

  6. Chapter 11. Frame, MainWindow, and Toplevel Widgets 框架,主窗体,顶级部件

    Chapter 11. Frame, MainWindow, and Toplevel Widgets   框架,主窗体,顶级部件 框架和Toplevels 都是设计用于其他部件的容器. 它们的不同在 ...

  7. Unix/Linux环境C编程入门教程(24) MySQL 5.7.4 for Red Hat Enterprise 7(RHEL7)的安装

    远观历史, MySQL的主要目的是为了能够在单处理器核心的商业服务器上运行.如今MySQL的一个变化用户可能不会注意到,那就是甲骨文已经开始重新架构MySQL的代码,使它大量的模块化.如软件解析器,优 ...

  8. MS SQL 当记录不存在时插入insert INTO not exists

    INSERT INTO dbo.[T_DabaoTemp]  ([PType]           ,[pID]           ,[NewVersion]           ,[ParentC ...

  9. OOP组合和继续的优缺点

    —— 详解继承与组合的优缺点   组合与继承都是提高代码可重用性的手段.在设计对象模型时,可以按照语义来识别类之间的组合关系和继承关系.在有些情况下,采用组合关系或者继承关系能完成同样的任务,组合和继 ...

  10. ora-00600笔记

    一. ORA-600 概述 Errorsof the form ORA-600 are called internal errors. This section clarifies themisund ...