存储
cookie:生命周期:可以设置时间 。 内存大小:几kb
localStorage:生命周期:只要不手动清除,一直存在。内存大小:几Mb
sessionStorage:生命周期:浏览器关闭时销毁。 内存大小:几Mb
cookie 和localStorage区别
1.存储大小不一样
2.发送请求的时候会默认携带cookie
localStorage对象
1.保存数据:localStorage.setItem(key(//属性名),value(//属性值 只能是基本数据类型)) key value 都是字符串的形式
document.getElementById('save').onclick=function(){
localStorage.setItem('姓名','小八')
}
//放对象的时候
JOSN.stringify() 把对象变成字符串的形式
var obj={
name:'老余',
age:19
}
localStorage.setItem('obj',JSON.stringify(obj))
2.读取数据:localStorage.getItem(key)
JOSN.parse() 把字符串转化为对象
document.getElementById('getDate').onclick = function (){
console.log(JSON.parse(localStorage.getItem('obj')));
}//{name: '老余', age: 19}
3.删除单个数据:localStorage.removeItem(key)
document.getElementById('del').onclick = function () {
// localStorage.removeItem('name');
localStorage.removeItem('age');
console.log(localStorage);
}
4.删除所有数据:localStorage.clear()
document.getElementById('delAll').onclick = function () {
localStorage.clear()
console.log(localStorage);
}
5.得到某个索引的key localStorage.key(index)
document.getElementById('getKey').onclick = function () {
var key = localStorage.key(0)
console.log(key);//姓名
}
sessionStorage
1.保存数据:sessionStorage.setItem(key(//属性名),value(//属性值 只能是基本数据类型)) key value 都是字符串的形式
2.读取数据:sessionStorage.getItem(key)
3.删除单个数据:sessionStorage.removeItem(key)
4.删除所有数据:sessionStorage.clear()
5.得到某个索引的key sessionStorage.key(index)