web前端全系列 教程
1839个小节阅读:2243.5k
鸿蒙应用开发
C语言快速入门
JAVA全系列 教程
面向对象的程序设计语言
Python全系列 教程
Python3.x版本,未来主流的版本
人工智能 教程
顺势而为,AI创新未来
大厂算法 教程
算法,程序员自我提升必经之路
C++ 教程
一门通用计算机编程语言
微服务 教程
目前业界流行的框架组合
web前端全系列 教程
通向WEB技术世界的钥匙
大数据全系列 教程
站在云端操控万千数据
AIGC全能工具班
A A
White Night
使用HTML5可以在本地客户端存储数据。
客户端存储数据的两个对象为:
localStorage
- 没有时间限制的数据存储sessionStorage
- 针对一个 session 的数据存储调用其中任一对象会创建 Storage
对象,在使用 web 存储前,应检查浏览器是否支持 localStorage
和sessionStorage
:
xxxxxxxxxx
if (typeof (Storage) !== "undefined") {
// 是的! 支持 localStorage sessionStorage 对象!
// 写一些自己的逻辑
}else {
// 抱歉! 不支持 web 存储。
}
localStorage
:存储的数据没有时间限制
保存数据:localStorage.setItem(key,value)
或者localStorage.key=value
读取数据:localStorage.getItem(key)
或者localStorage.key
删除单个数据:localStorage.removeItem(key)
删除所有数据:localStorage.clear()
得到某个索引的key
:localStorage.key(index)
xxxxxxxxxx
if (typeof (Storage) !== "undefined") {
//设置键值对,存储数据
localStorage.setItem('name', 'itbaizhan')
localStorage.setItem('thing', 'study')
//通过键获取值
console.log(localStorage.getItem('name'))
//通过索引获取键名
console.log(localStorage.key(1))
setTimeout(function () {
//清除数据
// localStorage.removeItem('name')
localStorage.clear()
}, 3000)
}
sessionStorage
:当用户关闭浏览器窗口后,数据会被删除
sessionStorage.setItem(key,value)
或者sessionStorage.key=value
sessionStorage.getItem(key)
或者sessionStorage.key
sessionStorage.removeItem(key)
sessionStorage.clear()
key
:sessionStorage.key(index)
xxxxxxxxxx
if (typeof (Storage) !== "undefined") {
//设置键值对,存储数据
sessionStorage.age=18
console.log(sessionStorage.age)
sessionStorage.setItem('name', 'itbaizhan')
sessionStorage.setItem('thing', 'study')
//通过键获取值
console.log(sessionStorage.getItem('name'))
//通过索引获取键名
console.log(sessionStorage.key(1))
setTimeout(function () {
//清除数据
sessionStorage.removeItem('name')
sessionStorage.clear()
}, 3000)
}
实时效果反馈
1.没有时间限制的存储方式是哪种:
A localStorage
B sessionStorage
答案
1=>A