专栏首页游戏杂谈HTML5的SessionStorage与Local Storage

HTML5的SessionStorage与Local Storage

HTML5中的存储分为三部分(FF中还提供了globalStorage,但不支持web sql database):

1、SessionStorage

2、LocalStorage

3、Web SQL Database

它们与Cookie最大的不同之处在于,cookie在向后台发送每一个http请求的时候都会出现在http头部,而html5的本地存储则不会,某种程度上讲是节约了一定的带宽,缩短了请求、响应的时间。而且ie6中对每一个域的cookie数限制为20个以内,大小也有限制

SessionStorage 类似设置一个会话Cookie(即不设置过期时间,当关闭浏览器或是页面时,会话Cookie将被清除)

各浏览器对存储的支持情况:

更多规范和参考,可以阅读:DiveInto HTML5  Storage

SessionStorage与LocalStorage他们都拥有相同的方法(常用有如下4个,更多信息可参考HTML5 APP):

1、setItem(key, value)

2、getItem(key)

3、removeItem(key)

4、clear()

要注意的事项:

1、setItem中的key、value使用的是字符串的形式进行存储的。也就是说如果有如下的代码:setItem(‘price’, 12);

通过getItem(‘price’) + 5 得到的将不是预期的17(整数),而是’125’(字符串)

2、再次使用setItem设置已经存在的key的value时,新的值将替代旧的值

当存储中的数据发生改变时,会触发相应的事件(但目前各浏览器对此事件的支持并不完善,暂时可以忽略)

这里有几个在线的例子:

html5 SessionStorage Demo

html5demos storage

html5 localStorage (name/value item pairs) demo

国外一位blogger写的关于LocalStorage教程:

Part One: Getting to Know localStorage

Part Two: Making localStorage Work For You

Part Three: Writing a Functioning Web App

Part Four: Putting The Finishing Touches On

还有一个完整的APP应用,地址在这里:http://time.monkeecreate.com/ ,源代码在github上:https://github.com/monkeecreate/monkeeTime

有兴趣可以延伸阅读关于DOM Storage相关的说明:

MDC DOM Storage

domcached(跨浏览器的)

jStorage - store data locally with JavaScript

HTTP Cookie

Flash Local Storage

IE userData behavior

DOMCached对各浏览器的支持情况(有基于prototype和jquery的两个版本)

关于web sql Database,可以阅读:introducing web sql database  需要注意它的事务“回滚”

例如先删除一张表,然后试图向那张表去插入数据,这将导致事务回滚(表将重新被恢复),在线示例:http://html5demos.com/database-rollback

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 手游推广方面的一些想法

    举个实际的例子,就是xx游戏xx区的A玩家,他通过游戏内的分享功能,分享一个链接至社交平台之后,通过该玩家分享的链接进行下载的玩家对A有一个返利,比如下载次数(...

    meteoric
  • 利用threshold实现的遮罩引导

    点击“开始引导”,则进入引导操作。除指定的按钮可以操作外,其它区域均不可点击。这种应用当新功能或是新产品上线后,用来引导用户来使用产品/功能,是十分有用的。fa...

    meteoric
  • as3解析人物动作序列图

    这里以《神仙道》中某一人物资源为例子,它的每一个动作都经过了处理,以中心点为基准点(这样就不需要程序来控制偏移量了,否则程序要改变bitmapData时还需要改...

    meteoric
  • 数据库市场阿里搅局 让去IOE不再疲软

    去IOE是伪命题,这是很多人公认的观点,IBM和EMC好去,可是去掉“O”谈何容易?因为我们在数据库方面没有积累,技术上存在明显差距,虽然国内也有一些数据库厂商...

    人称T客
  • redis的使用和安装,redis基础和高级部分

    编程软文
  • 学界 | 取代学习率衰减的新方法:谷歌大脑提出增加Batch Size

    机器之心
  • 第二节,Springboot自定义配置文件

    配置文件的作用:修改SpringBoot自动配置的默认值;SpringBoot在底层都给我们自动配置好;

    DencyCheng
  • 360面试总结(Android)

    版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/gdutxiaoxu/article/details/...

    用户2965908
  • 没有窗口函数,你能很快做出这道MySQL面试题吗?

    这是一个面试题目,相对难说有点难度,由于MySQL8.0以前没有“窗口函数”,当你碰到了这个题目,你是否能够很快写出这个答案来呢?

    朱小五
  • python 元组的列表排序

    random = [(2, 2), (3, 4), (4, 1), (1, 3)]

    用户5760343

扫码关注云+社区

领取腾讯云代金券