1.localStorage
- localStorage.setItem('key','value') 存数据 只能存字符串型
- localStorage.getItem('key') 取数据 有返回值 返回value
- localStorage.remove('key') 删除数据
- localStorage.clear() 清空数据
<body>
<button class="setItem">存数据</button>
<button class="getItem">取数据</button>
<button class="removeItem">删除数据</button>
<button class="clear">清空数据</button>
<script>
document.querySelector('.setItem').onclick = function () {
localStorage.setItem('username', '武洋')
localStorage.setItem('sex', '男')
localStorage.setItem('age', '18')
}
document.querySelector('.getItem').onclick = function () {
console.log(localStorage.getItem('age'));
}
document.querySelector('.removeItem').onclick = function () {
localStorage.removeItem('sex')
}
document.querySelector('.clear').onclick = function () {
localStorage.clear()
}
</script>
</body>
2.sessionStorage
语法 与 localStorage 基本一致
- sessionStorage.setItem('key','value') 存数据 只能存字符串型
- sessionStorage.getItem('key') 取数据 有返回值 返回value
- sessionStorage.remove('key') 删除数据
- sessionStorage.clear() 清空数据
3.两者区别(面试)
都有储存空间大小的限制,一般为 5 Mb
localStorage: 硬盘储存
sessionStorage: 内存储存