快速理解
web Storage是html5新增的数据存储方法，它与cookie之间的区别在于，
存储空间：cookie 的大小被限制在 4KB，Storage大小一般为 5~10MB，与具体浏览器有关；
网络消耗：只要涉及 cookie 请求都会携带cookie数据，消耗网络的带宽，Storage不会自动发送到服务器；
使用方面：Storage 提供了更丰富接口方便操作。
Storage不是cookie的替代品，是本地数据存储方法的补充。
详细介绍
Web Storage提供了两种存储类型 API：localStorage 和 sessionStorage。localStorage 生命周期长，除非主动手动删除，否则数据一直不会过期。sessionStorage生命周期短，当浏览器窗口被关闭时，sessionStorage对象保存的数据会被删除。
1.localStorage
存数据
localStorage.setItem(key, value);
读数据
localStorage.getItem(key);
删除数据
localStorage.removeItem(key);
2.sessionStorage
存数据，读数据
sessionStorage.pagecount
删除数据，没有接口。文章来源：https://www.toymoban.com/news/detail-533216.html
应用场景
localStorage ,用户一些全局设置，比如语言等。文章来源地址https://www.toymoban.com/news/detail-533216.html
到了这里，关于HTML5 Web Storage学习的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
![[HTML]Web前端开发技术9（HTML5、CSS3、JavaScript ）——喵喵画网页](https://imgs.yssmx.com/Uploads/2024/02/777294-1.png)
![[HTML]Web前端开发技术12（HTML5、CSS3、JavaScript ）——喵喵画网页](https://imgs.yssmx.com/Uploads/2024/02/793019-1.png)
![[HTML]Web前端开发技术26（HTML5、CSS3、JavaScript ）JavaScript基础——喵喵画网页](https://imgs.yssmx.com/Uploads/2024/02/828994-1.png)
![[HTML]Web前端开发技术7（HTML5、CSS3、JavaScript ）CSS的定位机制——喵喵画网页](https://imgs.yssmx.com/Uploads/2024/02/755631-1.png)
![[HTML]Web前端开发技术13（HTML5、CSS3、JavaScript ）横向二级导航菜单 Web页面设计实例——喵喵画网页](https://imgs.yssmx.com/Uploads/2024/02/797403-1.png)
![[HTML]Web前端开发技术6（HTML5、CSS3、JavaScript ）DIV与SPAN，盒模型，Overflow——喵喵画网页](https://imgs.yssmx.com/Uploads/2024/02/756611-1.png)
![[HTML]Web前端开发技术15（HTML5、CSS3、JavaScript ）表格，bordercolorlight，frame，valign，rowspan，colspan——喵喵画网页](https://imgs.yssmx.com/Uploads/2024/01/814211-1.png)
