sessionStorage 会话数据,localStorage 没有过期时间

两个的API基本都一样的

基本的使用

// 保存一个数据
sessionStorage.setItem('key', 'value'); // 获取指定数据, 不存在返回 null
var data = sessionStorage.getItem('key'); // 删除指定数据
sessionStorage.removeItem('key'); // 清空
sessionStorage.clear();

监听用户在浏览器中手动修改事件

window.addEventListener("storage", (e) => {
if (e.storageArea == localStorage) {
const { key, oldValue, newValue, url } = e;
console.log(
"[[ localStore Change ]] [%s]: (%s) => (%s)",
key,
oldValue,
newValue
);
}
}); localStorage.setItem("msg", "hello world");

h5 localStorage和sessionStorage浏览器数据缓存的更多相关文章

  1. HTML5 -- 浏览器数据缓存 -- indexedDB

    IndexedDB是一种可以让你在用户的浏览器内持久化存储数据的方法,为web应用提供了丰富的查询功能,使我们的应用在在线和离线都能正常工作. 由于 IndexedDB 本身的规范还在持续演进中,当前 ...

  2. 深入了解浏览器存储:对比Cookie、LocalStorage、sessionStorage与IndexedDB

    摘要: 对比Cookie.LocalStorage.sessionStorage与IndexedDB 作者:浪里行舟 Fundebug经授权转载,版权归原作者所有. 前言 随着移动网络的发展与演化,我 ...

  3. 浏览器存储localStorage、sessionStorage、cookie

    localStorage和sessionStorage浏览器支持IE8+(测试IE8不行): localStorage:用于长久保存整个网站的数据,保存的数据没有过期时间,直到手动去除 session ...

  4. localStorage和sessionStorage的使用方法和一些特性介绍

    本文主要介绍的是localStorage和sessionStorage的使用方法和一些特性,以及一些其他的存储方式的比较.   客服端存储方案包括以下几种:     1.Cookie     2.Us ...

  5. localStorage和sessionStorage使用

    localStorage.setItem("key","value");//存数据 localStorage.getItem("key"); ...

  6. h5本地缓存(localStorage,sessionStorage)

    H5本地存储数据 localStorage,sessionStorage的区别: 相同点:  缓存数据比cookie的范围大; localStorage:关闭浏览器数据不会消失,除非手动删除数据 se ...

  7. h5 的localStorage和sessionStorage存到缓存里面的值是string类型

    localStorage永久存在,不手动清除永远存在:sessionStorage 一次会话的浏览器关闭就自动清除 h5 的localStorage和sessionStorage 存到缓存里面的值都是 ...

  8. JS 客户端(浏览器)存储数据之 localStorage、sessionStorage和indexDB

    基本概念 1.localStorage和sessionStorage是HTML5 Web存储的提供的两种存储方式,在IE7以上以及大多数浏览器都是支持的 2.localStorage和sessionS ...

  9. 利用H5本地存储localStorage、sessionStorage

    最近的业务处理上,要使用cookie缓存储一下数据,公司的cookie还搞出点问题.而用户的浏览器都是利用微信的内置,普遍支持h5的本地存储.于是利用了这个... 现代浏览器普遍开始支持H5本地存储, ...

随机推荐

  1. 深入TLS/SSL协议

    总体 TLS/SSL协议是为了解决网络通讯中的信息安全问题而诞生的. 它的设计目的主要有三个: 身份验证--搞清楚与我通讯的人是不是我所想的那个. 保密性--就算第三方拿到了通讯内容,也搞不清楚其中所 ...

  2. socket更多方法

    一.socket的更多方法介绍 ###socket更多方法服务端套接字函数 s.bind() 绑定(主机,端口号)到套接字 s.listen() 开始TCP监听 s.accept() 被动接受TCP客 ...

  3. python基础(格式化输出、基本运算符、编码)

    1,格式化输出. 现有一练习需求,问用户的姓名.年龄.工作.爱好 ,然后打印成以下格式 ------------ info of Alex Li ----------- Name : Alex Li ...

  4. Vue技术点整理-Vuex

    什么是Vuex? 1,Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式.它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化 2,每一个 Vuex ...

  5. JavaScript(二)——在 V8 引擎中书写最优代码

    概述 一个 JavaScript 引擎就是一个程序或者一个解释程序,它运行 JavaScript 代码.一个 JavaScript 引擎可以用标准解释程序或者即时编译器来实现,即时编译器即以某种形式把 ...

  6. Django(图书管理系统)

    图书管理系统 注意事项 1.models 要创建好,规划好自己的表,以及各种表关系 2.url正则要写好 3.settings的配置 4.利用bootstarp 进行布局更漂亮哦 5.注意orm  各 ...

  7. Educational Codeforces Round 30

    Educational Codeforces Round 30  A. Chores 把最大的换掉 view code #pragma GCC optimize("O3") #pr ...

  8. HDU6331 Problem M. Walking Plan【Floyd + 矩阵 + 分块】

    HDU6331 Problem M. Walking Plan 题意: 给出一张有\(N\)个点的有向图,有\(q\)次询问,每次询问从\(s\)到\(t\)且最少走\(k\)条边的最短路径是多少 \ ...

  9. 【noi 2.7_7219】复杂的整数划分问题(算法效率)

    题意:若干组数据,分别问 N划分成K个正整数之和的划分数目.N划分成若干个不同正整数之和的划分数目.N划分成若干个奇正整数之和的划分数目. 解法:请见我之前的一篇博文内的Article 2--[noi ...

  10. 【noi 2.6_8464】股票买卖(DP)

    题意:N天可买卖2次股票,问最大利润. 解法:f[i]表示前 i 天买卖一次的最大利润,g[i]表示后 i 天. 注意--当天可以又买又卖,不要漏了这个要求:数据较大. 1 #include<c ...