JavaScript学习笔记

localStorage对象

localStorage:本地存储,HTML5的新技术

1.没有时间限制

2.提供了相关的操作函数(增删改查)

localStorage的length属性:存储数据的条数

添加,修改,查找

localStorage.name = "王二麻子";
console.log(localStorage.name);
localStorage["age"] = 20;
// 语法:localStorage.setItem(key,value);
localStorage.setItem('gender',"男");
console.log(localStorage.getItem("gender"));

删除某一个

localStorage.removeItem("name");

删除全部

localStorage.clear();

遍历所有的localStorage属性

for (var i = 0; i < localStorage.length; i++) {
	var k = localStorage.key(i);
	console.log(k,localStorage.getItem(k));
}

sessionStorage对象

sessionStorage，他主要用于临时保存同一窗口(或标签页)的数据，在关闭窗口或标签页之后将会删除这些数据。本篇主要介绍 sessionStorage(会话存储)的使用方式。包括添加、修改、删除等操作。

存储数据

sessionStorage.setItem("key","value");

读取数据

sessionStorage.getItem("key");

sessionStorage也可存储Json对象

存储时，通过JSON.stringify()将对象转换为文本格式；读取时，通过JSON.parse()将文本转换回对象。

var userEntity = {name: 'tom',age: 22};

// 存储值：将对象转换为Json字符串
sessionStorage.setItem('user', JSON.stringify(userEntity));

// 取值时：把获取到的Json字符串转换回对象
var userJsonStr = sessionStorage.getItem('user');
userEntity = JSON.parse(userJsonStr);
console.log(userEntity.name); // => tom

删除指定的元素

sessionStorage.remove("sessionObject")

删除全部

sessionStorage.clear();

总结

localStorage 和 sessionStorage 属性允许在浏览器中存储 key/value 对的数据。

sessionStorage 用于临时保存同一窗口(或标签页)的数据，在关闭窗口或标签页之后将会删除这些数据。

localStorage 用于永久保存同一窗口(或标签页)的数据，在关闭窗口或标签页之后这些数据不会被删除。