在客户端存储数据
HTML5 提供了两种在客户端存储数据的新方法:
localStorage - 没有时间限制的数据存储
sessionStorage - 针对一个 session 的数据存储
之前,这些都是由 cookie 完成的。但是 cookie 不适合大量数据的存储,因为它们由每个对服务器的请求来传递,这使得 cookie 速度很慢而且效率也不高。
在 HTML5 中,数据不是由每个服务器请求传递的,而是只有在请求时使用数据。它使在不影响网站性能的情况下存储大量数据成为可能。
对于不同的网站,数据存储于不同的区域,并且一个网站只能访问其自身的数据。
HTML5 使用 JavaScript 来存储和访问数据。
localStorage 方法
localStorage 方法存储的数据没有时间限制。第二天、第二周或下一年之后,数据依然可用。
如何创建和访问 localStorage:
<script type="text/javascript">
localStorage.lastname="Smith";
document.write(localStorage.lastname);
</script>
下面的例子对用户访问页面的次数进行计数:
<script type="text/javascript">
if (localStorage.pagecount)
{
localStorage.pagecount=Number(localStorage.pagecount) +1;
}
else
{
localStorage.pagecount=1;
}
document.write("Visits "+ localStorage.pagecount + " time(s).");
</script>
sessionStorage 方法
sessionStorage 方法针对一个 session 进行数据存储。当用户关闭浏览器窗口后,数据会被删除。
如何创建并访问一个 sessionStorage:
<script type="text/javascript">
sessionStorage.lastname="Smith";
document.write(sessionStorage.lastname);
</script>
下面的例子对用户在当前 session 中访问页面的次数进行计数:
<script type="text/javascript">
if (sessionStorage.pagecount)
{
sessionStorage.pagecount=Number(sessionStorage.pagecount) +1;
}
else
{
sessionStorage.pagecount=1;
}
document.write("Visits "+sessionStorage.pagecount+" time(s) this session.");
</script>
引用:http://www.3wschool.com.cn/
分享到:
相关推荐
WEB开发 之 HTML 5 Web 存储.docx
web存储 html5
第3章 HTML5规范的本地存储 23 第4章 移动Web的离线应用 34 第5章 移动设备的常见HTML5表单元素 40 第6章 移动Web界面样式 48 第7章 Geolocation地理定位 74 第8章 轻量级框架jQuery Mobile初探 79 第9章 重量级富...
一个本地数据库(Web SQL Database)实现的通信录;介绍怎样创建打开数据库,创建表,添加数据,更新数据,删除数据,删除表 等等。
web渗透--5--web服务器指纹识别.pdf web渗透--50--WebSockets安全测试.pdf web渗透--51--异常信息泄漏.pdf web渗透--52--防御应用程序滥用.pdf web渗透--53--客户端资源处理漏洞.pdf web渗透--54--HTML注入.pdf web...
HTML5 提供了两种在客户端存储数据的新方法: localStorage - 没有时间限制的数据存储 sessionStorage - 针对一个 session 的数据存储 之前,这些都是由 cookie 完成的。但是 cookie 不适合大量数据的存储,因为...
第3章 HTML5规范的本地存储 第4章 移动WEB的离线应用 第5章 移动设备的常见HTML5表单元素 第6章 移动WEB界面样式 第7章 GEOLOCATION地理定位 第8章 轻量级框架JQUERY MOBILE初探 第9章 重量级富框架SENCHA TOUCH入门...
HTML5Sticky是一个HTML5应用,用于创建一个基于Web的便签。它使用了HTML5的本地存储和CSS3等技术来创建便签。这意味着,创建的便签可以被持久化保存。经测试支持的浏览器包括:Chrome, Firefox 3.5 , Safari 4 , ...
且不说这些,单看在HTML5中如何实现离线数据的CRUD,最基本的用法(入门级别) 1,打开数据库 2,创建表 3,新增数据 4,更新数据 5,读取数据 6,删除数据 事实上,关键点在于如何拿到一个可执行SQL语句的上下文, 像创建表,...
HTML5程序设计-3期(KC014) KC014050000007 单元设计_单元7 HTML5 Web存储.doc 学习资料 复习资料 教学资源
【HTML5】 [HTML5揭秘].(HTML5:Up.and.Running).Mark.Pilgrim.文字版(高清文本 PDF 本书全面而深入地对HTML5相关的技术进行详细介绍和剖析。“从开始到现在”道出HTML5的坎坷发展史;“HTML5特性检测”介绍了多种...
该存储库包含ASP.NET Core应用程序中使用C#代码和HTML5组件的Stimulsoft Reports.Web报告工具用法示例示例的源代码。 该产品和示例与.NET Core 2.0及更高版本兼容。 总览 该存储库在不同的文件夹中都有一些示例...
第10章讲解了HTML5中的各种Web存储技术,以及Web存储API;第11章阐述了索引数据库的具体操作、实现原理,以及它的API;第12章讲解了HTML5中的文件操作和文件系统,以及文件API;第13章介绍了HTML5中的Ajax、跨文档...
利用web Storage实现大数据的在线存储
SpaceBuilder\Common.Web\Web\Html\SPBHtmlHelper.VerificationCode.cs 6.解决圈子话题可以在论坛中恶意构造显示的问题 Forum.Web\Controllers\ForumController.cs Web\Themes\Channels\Default\Pages\Forums\...
HTML5简介 HTML5的canvas元素 HTML5的audio元素 HTML5的vedio元素 HTML5的vedio元素 HTML5的Web存储 HTML5的input类型 HTML5的表单属性 总结
《精通HTML5 + CSS3+JavaScript网页设计》内容主要包括CSS3的基本语法和概念,设置文字、段落、图片、背景、表格、表单和菜单等网页元素的方法,以及CSS3滤镜的应用。...第20章 地理定位、离线Wed应用和Web存储
html5Web存储和缓存技术简单案例,适合新手来看看哦
从第2 章起,分别围绕构建令人神往的富web 应用,逐一讨论了html5 的canvas、geolocation 、communication、websocket、forms、web workers、storage 等api 的使用, 辅以直观明了的客户端和服务器端示例代码,让...