189 8069 5689

localstorge和seesionstorage是什么意思-创新互联

这篇文章主要介绍localstorge和seesionstorage是什么意思,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!

在介休等地区,都构建了全面的区域性战略布局,加强发展的系统性、市场前瞻性、产品创新能力,以专注、极致的服务理念,为客户提供做网站、成都网站制作 网站设计制作按需定制设计,公司网站建设,企业网站建设,成都品牌网站建设,成都营销网站建设,成都外贸网站建设公司,介休网站建设费用合理。

sessionStorage属性允许你访问一个 session Storage 对象。它与 localStorage 相似,不同之处在于 localStorage 里面存储的数据没有过期时间设置,而存储在 sessionStorage里面的数据在页面会话结束时会被清除。页面会话在浏览器打开期间一直保持,并且重新加载或恢复页面仍会保持原来的页面会话。在新标签或窗口打开一个页面会初始化一个新的会话,这点和 session cookies 的运行方式不同。

只读的localStorage 允许你访问一个Document 的远端(origin)对象 Storage;数据存储为跨浏览器会话。 localStorage 类似于sessionStorage。区别在于,数据存储在 localStorage 是无期限的,而当页面会话结束——也就是说当页面被关闭时,数据存储在sessionStorage 会被清除 。

简单来看,localStorage是一个浏览器持久化存储方案,而sessionStorage与session不同的是它只存在于一个页面之中,新开页面的话sessionStorage会被重置。 应注意无论数据存储在 localStorage 还是 sessionStorage ,它们都特定于页面的协议

基本用法

首先我们来看一下sessionStorage的操作

1.保存数据到sessionStorage sessionStorage.setItem('key', 'value');

2.从sessionStorage获取数据

var sessionData = sessionStorage.getItem('key');

3.从sessionStorage删除保存的数据

sessionStorage.removeItem('key');

4.移除所有

sessionStorage.clear();

相同的 localStorage也有着类似的操作

1.保存数据

localStorage.setItem(`key`, `value`);

2.获取数据

let cat = localStorage.getItem(`key`);

3.删除单个数据

localStorage.removeItem(`key`);

4.移除所有

localStorage.clear();

可以通过 localStorage.length 来获取localStorage中键值对的数量,同样的也可以通过 localStorage.key() 方法来遍历 localStorage 存储的键值。

storage 事件

当存储的数据发生变化时,会触发 storage 事件。但要注意的是它不同于click类的事件会事件捕获和冒泡,storage 事件更像是一个通知,不可取消。触发这个事件会调用同域下其他窗口的storage事件,不过触发storage的窗口(即当前窗口)不触发这个事件。storage 的 event 对象的常用属性如下 (当前窗口不触发,其他窗口会触发) 。

changeEvent的常用属性如下:

oldValue:更新前的值。如果该键为新增加,则这个属性为null。
newValue:更新后的值。如果该键被删除,则这个属性为null。
url:原始触发storage事件的那个网页的网址。
key:存储store的key名

以上是“localstorge和seesionstorage是什么意思”这篇文章的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注创新互联成都网站设计公司行业资讯频道!

另外有需要云服务器可以了解下创新互联scvps.cn,海内外云服务器15元起步,三天无理由+7*72小时售后在线,公司持有idc许可证,提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案,具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势,专为企业上云打造定制,能够满足用户丰富、多元化的应用场景需求。


文章名称:localstorge和seesionstorage是什么意思-创新互联
新闻来源:http://cdxtjz.cn/article/jcdhg.html

其他资讯