前端存储的方式

一、本地存储和cookie的区别
本地存储的特点:
存储量限制(5M)
客户端完成,不会请求服务器处理
sessionStorage数据是不共享
localStorage共享
cookie特性:
同一个网站中所有页面共享一套cookie
数量、大小有限(大小4KB)
过期时间
cookie是随HTTP事务一起被发送给服务器
二、本地存储的分类
HTML本地存储提供了两个在客户端存储数据的对象
①. window.localStorage – 存储没有截止日期的数据
②. window.sessionStorage – 针对一个session来存储数据(当关闭浏览器标签页时数据会丢失)
不管是localStorage,还是sessionStorage,可使用的API都相同,即方法相同
三、web storage常用的方法
1.setItem() 设置数据,key\value类型,类型都是字符串
2.getItem() 获取数据,通过key来获取到相应的value
3.removeItem() 删除数据,通过key来删除相应的value
4.clear() 删除所有数据

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
三种前端存储方式的异同如下: 1. localStorage和sessionStorage: - 存储大小:localStorage一般是5M左右,而sessionStorage大小约为4kb左右,50条左右\[1\]\[3\]。 - 存储特点:localStorage和sessionStorage都是永久性存储,但localStorage的存储内容过多会消耗内存空间,导致页面变卡。localStorage不能被爬虫抓取到,而sessionStorage在隐私模式下是不可读取的\[1\]\[3\]。 - 存储方式:localStorage和sessionStorage都遵循同源策略,只支持string类型的存储。可以使用setItem方法存储数据,使用getItem方法读取数据,使用removeItem方法删除指定数据,使用clear方法清空所有存储数据\[1\]。 2. Cookie: - 存储大小:Cookie的存储大小约为4kb左右,50条左右\[3\]。 - 存储特点:Cookie是会话级的存储,关闭窗口并不会删除,需要关闭整个浏览器才可以删除\[3\]。 - 存储方式:可以直接使用document.cookie来存取数据。可以设置expires来控制Cookie的有效时间,设置path来控制Cookie的使用路径,设置domain来控制可以访问该Cookie的域名\[3\]。 总结: - localStorage和sessionStorage适合存储较大量的数据,而Cookie适合存储较小量的数据。 - localStorage和sessionStorage是永久性存储,而Cookie是会话级的存储。 - localStorage和sessionStorage遵循同源策略,而Cookie可以通过设置path和domain来控制访问范围。 - localStorage和sessionStorage的存储内容不会被爬虫抓取到,而Cookie可以通过设置expires来控制有效时间。 #### 引用[.reference_title] - *1* *2* *3* [【前端存储】storage/cookie的异同](https://blog.csdn.net/weixin_43523913/article/details/107110651)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值