HTML 客户端存储
在客户端存储数据
HTML5 提供了两种在客户端存储数据的新方法:
- localStorage - 没有时间限制的数据存储
- sessionStorage - 针对一个 session 的数据存储
之前,这些都是由 cookie 完成的。但是 cookie 不适合大量数据的存储,因为它们由每个对服务器的请求来传递,这使得 cookie 速度很慢而且效率也不高。
在 HTML5 中,数据不是由每个服务器请求传递的,而是只有在请求时使用数据。它使在不影响网站性能的情况下存储大量数据成为可能。
对于不同的网站,数据存储于不同的区域,并且一个网站只能访问其自身的数据。
HTML5 使用 JavaScript 来存储和访问数据。
浏览器支持
Internet Explorer 8+, Firefox, Opera, Chrome, 和 Safari支持Web 存储。
注意: Internet Explorer 7 及更早IE版本不支持web 存储。
localStorage 和 sessionStorage
There are two new objects for storing data on the client:
- localStorage - 没有时间限制的数据存储
- sessionStorage - 针对一个 session 的数据存储
在使用 web 存储前,应检查浏览器是否支持 localStorage 和sessionStorage:
if(typeof(Storage)!=="undefined")
{
// Yes! localStorage and sessionStorage support!
// Some code.....
}
else
{
// Sorry! No web storage support..
}
localStorage 对象
localStorage 对象存储的数据没有时间限制。第二天、第二周或下一年之后,数据依然可用。
实例
localStorage.lastname="Smith";
document.getElementById("result").innerHTML="Last name: "
+ localStorage.lastname;
sessionStorage 对象
sessionStorage 方法针对一个 session 进行数据存储。当用户关闭浏览器窗口后,数据会被删除。
如何创建并访问一个 sessionStorage:
实例
<script type="text/javascript">
sessionStorage.lastname="Smith";
document.write(sessionStorage.lastname);
</script>
HTML 客户端存储的更多相关文章
- JavaScript的客户端存储
一.前言: 客户端存储实际上就是Web浏览器的记忆功能,通过浏览器的API实现数据存储到硬盘: 二.存储的不同形式: 1.Web存储:localStorage 和 sessionStorage 代表同 ...
- js023-离线应用与客户端存储
js023-离线应用与客户端存储 本章内容: 进行离线检测 使用离线缓存 在浏览器中保存数据 23.1 离线检测 第一步:知道设备是在线还是离线:navigator.Online属性.该值为true表 ...
- js-新兴的API,最佳实践,离线应用于客户端存储
离线应用于客户端存储: 1.离线检测:online以及offline事件,都是在window对象上触发 navigator.online为true的时候是表示设备能够上网 2.使用一个描述文件(man ...
- Web - 客户端存储的几种方式
客户端存储主要方便一些APP离线使用.今天就来说说客户端存储的方法有多少? 说在最前面的一句:所有的客户端存储都有一个原则:读写的数据必须要同域 1 Cookie Cookie是一项很老的技术的,就是 ...
- 《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 离线检 ...
- HTML5学习笔记之客户端存储数据方法:localStorage(),sessionStorage()
HTML5提供了两种在客户端存储数据的新方法: localStorage():没有时间限制的数据存储 sessionStorage():针对一个session的数据存储 下面的一个例子用localSt ...
- 客户端存储 API
介绍两个在客户端存储数据的 API localStorage与sessionStorage 两个都是window对象的属性,利用这两个属性,可以在客户端存储一些数据 相比cookie,这种存储方式的优 ...
- HTML5 客户端存储数据的两种方式
HTML5 提供了两种在客户端存储数据的新方法: localStorage - 没有时间限制的数据存储 sessionStorage - 针对一个 session 的数据存储 之前,这些都是由 coo ...
- 动画优化、客户端存储、历史记录、worker
一.requestAnimationFrame 1.requestAnimationFrame怎么用? 设置关键帧动画效果,注重关键帧执行的情况,用法与setTimeout一样 2.requestAn ...
- 离线应用与客户端存储(cookie storage indexedDB)
离线检测 HTML5定义一个属性:navigator.onLine的属性.这个属性值为true,表示设备在线,值为false,表示设备离线.为了更好的确定网络是否可用,HTML5还定义了两个事件.这两 ...
随机推荐
- oracle 当中,(+)是什么意思
SELECT A.id, B.IDDFROM A, BWHERE A.id(+)=B.IDD等价于SELECT A.id, B.IDDFROM A RIGHT OUTER JOIN B ON ( A. ...
- 关于Boot应用中集成Spring Security你必须了解的那些事
Spring Security Spring Security是Spring社区的一个顶级项目,也是Spring Boot官方推荐使用的Security框架.除了常规的Authentication和A ...
- LA 3644 简单并查集
题目大意:有一些简单的化合物,每个化合物由两种元素组成,把这些化合物按顺序装车,若k个化合物正好包含k种元素,那么就会爆炸.避免爆炸,有些化合物就不能装车.求有多少个不能装车. 题目分析:若k个化合物 ...
- hdu 5691 Sitting in Line
传送门 Sitting in Line Time Limit: 10000/5000 MS (Java/Others) Memory Limit: 262144/262144 K (Java/O ...
- spring-boot-nginx代理-docker-compose部署
在本地测试,使用docker部署不用在意环境 java测试项目: web框架:spring boot 框架 项目管理:maven 数据库:redis + postgres + mongo 部署相关:n ...
- web信息搜索之目标扫描篇
https://blog.csdn.net/dongfei2033/article/details/78175421
- 漫话最小割 part1
codeforces 724D [n个城市每个城市有一个特产的产出,一个特产的最大需求.当i<j时,城市i可以运最多C个特产到j.求所有城市可以满足最大的需求和] [如果直接最大流建图显然会T. ...
- ueditor整合之后前段不显示高亮
自己整合ueditor插件后,发现在前段显示的时候并没有高亮处理 在网上看了一些方法后,自己尝试了下. 1.在页面上引入相关的js和css文件 主要是以下两个文件 <script src=&qu ...
- LeetCode:926. 将字符串翻转到单调递增
暴力法超时:思想:动态规划 public int minFlipsMonoIncrb(String S) { int result = S.length(); for (int i = 0; i &l ...
- Oracle SQL Developer Chanage UI to US Lanaguage
\sqldeveloper-4.1.3.20.78-x64\sqldeveloper\sqldeveloper\bin Add content: AddVMOption -Duser.country= ...