首页 > web前端 > H5教程 > 正文

HTML5 Web Storage的图文详解

黄舟
发布: 2017-03-28 15:47:09
原创
1678人浏览过

web storage是html5 api提供一个新的重要的特性;

最新的Web Storage草案中提到,在web客户端可用html5 API,以Key-Value形式来进行数据持久存储;

目前主要的浏览器已经支持该功能;

常见的web客户端数据存储比较:

立即学习前端免费学习笔记(深入)”;

Html5 Web Storage非常易于Web开发者使用,他提供了非常简单的获取或设置key-value对的API;

支持的数据大小由网页浏览器厂商来决定,大多数支持都是5M或10M以上;

这就意味着,我们可以在客户端存储更多有关用户及会话的信息,诸如用户个人设置、本地化数据、离线数据等;

Web Storage存储的数据可能用javascript来进行访问;

Web Storage对象主要分为两种类型:sessionStorage and localStorage;

 

sessionStorage:是针对用户执行单个事务的方案而设计的,仅在单个页面(标签或者窗口)会话范围内是有效的。所以当页面session失效时,数据也会删除

localStorage:是跨多个窗口,且持续范围可超过当前会话;意味着当浏览器关闭再重新打开,数据依然是可用的;

存了个图
存了个图

视频图片解析/字幕/剪辑,视频高清保存/图片源图提取

存了个图 17
查看详情 存了个图

这两种类型的对象,在不同的浏览器之间访问数据是无效的;例如,我们在Firefox中创建localStorage,要在IE中去访问,是访问不到数据的;

Storage只能存储key/value对,而且只支持字符串类型的数据如果你想保存其它类型的数据,在保存的时候就需要转化成字符串,在读取时,再转化回来;

它保存的数据并不进行加密,所以虽然web Storage功能很强大,但也不宜保存比较敏感的数据;

Web Storage支持的属性与方法:

Web Storage支持storage事件

当web storage中的数据被保存后,修改或删除数据,都会触发Storage事件。

触发该事件对象,包含了触发对象,URL及key/value变化前后的键值。

虽然规范里要求Storage事件在同一个浏览器里能被所有的窗口或者标签页触发,但是该功能目前只有少数的浏览器支持。

Storage Event支持的属性有:

 

 

以上就是HTML5 Web Storage的图文详解的详细内容,更多请关注php中文网其它相关文章!

相关标签:
HTML速学教程(入门课程)
HTML速学教程(入门课程)

HTML怎么学习?HTML怎么入门?HTML在哪学?HTML怎么学才快?不用担心,这里为大家提供了HTML速学教程(入门课程),有需要的小伙伴保存下载就能学习啦!

下载
来源:php中文网
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
开源免费商场系统广告
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号