h5本地缓存(localStorage,sessionStorage)

H5本地存储数据 localStorage,sessionStorage的区别:

  相同点:  缓存数据比cookie的范围大;

  localStorage:关闭浏览器数据不会消失,除非手动删除数据

  sessionStroage:数据暂时缓存在客户端,关闭浏览器数据丢失

下面是localStorage,sessionStorage常用的方法:

   setItem(‘name’,'xsxs');//设置数据

   getItem('name');//获取数据 

   removeItem('name');//移除某条属性的数据

  clear();//清空数据 

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>sessionStorage,localStorage,cookie</title>

</head>
<body>
	<script>
// sessionStorage本地缓存数据,关闭浏览器数据消失
		window.sessionStorage.setItem("name", 'lixiaohu');
		// 设置属性
		window.sessionStorage.setItem('age', "11");
		window.sessionStorage.setItem('sex', "girl");
		var ss = window.sessionStorage.getItem('name');//获取属性
		console.log(ss);
		// window.sessionStorage.removeItem('age');//移除某个属性的键
		// window.sessionStorage.clear();//清空缓存的数据
// localStorage本地缓存方式,关闭浏览器数据不丢失,除非手动删除数据
		window.localStorage.setItem('school', '中原工学院信息商务学院');
		window.localStorage.setItem('classname', '计算机科学与技术');
		var schools = window.localStorage.getItem('school');
		console.log(schools);
		// window.localStorage.removeItem('classname');
		// window.localStorage.clear();

	</script>
</body>
</html>

  

原文地址:https://www.cnblogs.com/lvxisha/p/9776497.html