HTML5 提供了两种在client存储数据的新对象:

localStorage:没有时间限制的数据存储,在同一个浏览器中,仅仅要没被手动清理,第二天、第二周或下一年之后,数据依旧可用。

sessionStorage:针对一个 session 的数据存储。针对一个 session 进行数据存储。当用户关闭浏览器窗体后,数据会被删除(并且仅仅在当前窗体有效)。

下面是使用这两个对象的样例:

在client存储数据

HTML5 提供了两种在client存储数据的新方法:

  • localStorage:没有时间限制的数据存储
  • sessionStorage:针对一个 session 的数据存储

localStorage的使用:

localStorage存储的数据没有时间限制。在同一个浏览器中,仅仅要没被手动清理,第二天、第二周或下一年之后,数据依旧可用。

样例:你在本机使用本浏览器第 次浏览本页面。

sessionStorage的使用:

sessionStorage针对一个 session 进行数据存储。

当用户关闭浏览器窗体后,数据会被删除(并且仅仅在当前窗体有效)。

样例:你在本次打开此窗体后,第 次浏览了本页面。

$(function(){

recordVisitCount();

recordSessionCount();

});

function recordVisitCount(){

if (localStorage.pagecount){

localStorage.pagecount=Number(localStorage.pagecount) +1;

} else {

localStorage.pagecount=1;

}

$("#visitCount").html(localStorage.pagecount);

}

function recordSessionCount(){

if (sessionStorage.pagecount) {

sessionStorage.pagecount = Number(sessionStorage.pagecount) + 1;

} else {

sessionStorage.pagecount = 1;

}

$("#visitCountPerSession").html(sessionStorage.pagecount);

}

执行结果例如以下:

(原创文章。转载请注明转自Clement-Xu的csdn博客。)

html5本地缓存如何提交,HTML5: 本地缓存相关推荐

  1. Git的基本使用(用户初始化配置、新建代码库、把文件提交到缓存区、把文件提交到本地仓库等)

    [基本概念] Git: Git是负责对工作区的文件进行版本控制,因为Git装在本地,那么在本地(当前计算机下)就必须要有一个仓库,这个仓库中记录了所有的版本变化. Github: 公网上典型的远程仓库 ...

  2. .net html5页面缓存,详解HTML5中的manifest缓存使用

    起源html5之前的网页,都是无连接,必须联网才能访问,这其实也是web的特色,这其实对于PC是时代问题并不大,但到了移动互联网时代,设备终端位置不再固定,依赖无线信号,网络的可靠性变得降低,比如坐在 ...

  3. Html5移动开发之Localstorage(本地存储)

    HTML5本地存储Localstorage 自从Html5中出现了本地存储的(LocalStorage)的概念后,很多人都会想这个东西和我们传统web开发中的Cookie有什么特别之处,当然笔者也是其 ...

  4. 使用 jQuery Mobile 与 HTML5 开发 Web App (十七) —— HTML5 离线缓存

    本文要介绍的,是 HTML5 离线网络应用程序的特性,离线网络应用程序在 W3C 中的实际名称是 "Offline Web applications" ,也称离线缓存.当用户打开浏 ...

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

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

  6. java 项目做多级缓存_【开源项目系列】如何基于 Spring Cache 实现多级缓存(同时整合本地缓存 Ehcache 和分布式缓存 Redis)...

    一.缓存 当系统的并发量上来了,如果我们频繁地去访问数据库,那么会使数据库的压力不断增大,在高峰时甚至可以出现数据库崩溃的现象.所以一般我们会使用缓存来解决这个数据库并发访问问题,用户访问进来,会先从 ...

  7. Android图片三级缓存(网络,本地,内存)介绍及简单实现

    三级缓存使用的必要性 假如每次启动的时候都从网络拉取图片的话,势必会消耗很多流量.在当前的状况下,对于非wifi用户来说,流量还是很贵的,一个很耗流量的应用,其用户数量级肯定要受到影响 当我们想要重复 ...

  8. 网卡清空缓存命令_怎么清除dns缓存 查看与刷新本地DNS缓存方法 (全文)

    由于近几日百事网更换了cdn加速服务商,导致不少地区朋友无法访问百事网,包括小编电脑也是经常打不开,目前主要可以通过清除dns缓存来解决.一般来说,电脑在第一次访问一个网站后,在一定时间内会有本地DN ...

  9. android自定义图片缓存,适用于Android的本地图像缓存解决方案:Squ...

    更新于2018年9月:几年后,我需要与本地图像缓存解决方案几乎相同的东西.这一次,UIL尚未积极开发.我比较了流行的库,结论很简单:只需使用Glide.它功能强大且可配置.多年前我不得不分叉并对UIL ...

最新文章

  1. java 反射加实例化内部类
  2. pytest第二版 进阶学习
  3. JavaScript专题之从零实现jQuery的extend
  4. 【华为敏捷/DevOps实践】7. 敏捷,DevOps,傻傻不分清楚
  5. Keil(MDK-ARM-STM32)介绍、下载、安装与注册
  6. 在 Hibernate 中出现 database product name cannot be null 时怎么解决?
  7. JVM堆内存监测的一种方式,性能调优依旧任重道远
  8. springboot框架搭建
  9. 卡巴斯基安全部队2013 卡巴斯基正式版 送一年使用序列号
  10. 跨境电商SaaS会成为一门大生意吗?
  11. c++ 度分秒相互转化
  12. PropertyUtils的使用
  13. 高中 信息科技 计算机网络 课件,高中信息技术计算机网络.ppt课件.ppt.ppt
  14. 线结构光传感器的标定
  15. 单阶段和两阶段目标检测
  16. python在数据分析方面的应用-数据分析应用方面Python和spss有什么区别?
  17. 计算机游戏动漫制作自我鉴定,动画制作专业毕业生的自我鉴定范文(精选5篇)...
  18. 《沈剑架构师训练营》第6章 - 缓存架构
  19. 逆幂律模型_为“成功”建模:幂律分布
  20. 魔术的逻辑(三)——明明是假的,但为何奇迹依旧美妙?

热门文章

  1. Spring boot排除依赖
  2. Select2控件的使用
  3. easyUI的目录结构
  4. 更改mssqlserver的表的编码格式_Excel格式全揭秘,赶紧收藏起来吧
  5. 采用 Vue 编写的功能强大的 Swagger-ui 页面
  6. 手把手 docker 从零搭建 jenkins 服务器
  7. JDK 13 的最新垃圾回收器ZGC,你了解多少?
  8. 寻找数组中最小的k个数(快排和堆排)
  9. pythone 打开文件 一行_【精品资料】用了这么多年单片机的Hex文件不懂?看这篇就够了...
  10. MySQL数据库的常用操作