浏览器缓存数据以及删除缓存数据（localstorage的用法）

最新推荐文章于 2024-08-15 20:33:20 发布

兔老大的胡萝卜

最新推荐文章于 2024-08-15 20:33:20 发布

阅读量1.5w

点赞数 2

本文链接：https://blog.csdn.net/nuoyuezuo/article/details/83714368

版权

<!DOCTYPE html>
<html>
<head>
	<title></title>
	<meta charset="utf-8">
	<script type="text/javascript" src="jquery-2.1.1.min.js"></script>
</head>
<body>
	<input type="button" name="" value="缓存内容" id="input1">
	<input type="button" name="" value="清除缓存内容" id="input2">
</body>
	<script type="text/javascript">
		//初始化界面
		$(function(){
			if (localStorage.hasOwnProperty("data")) {   //判读是否有data的属性，有就叠加
				var json = JSON.parse(localStorage.getItem("data")); //转换数据类型
				var rs = JSON.parse(localStorage.getItem("data"));
			}else{ //没有就形成一个空数组，然后往里叠加
				var json = [];
			}

			//开始缓存
			$('#input1').click(function(){
				var data = {
					"name" : "这个程序是好的!",
					"type" : "这个程序是烂的！",
				}
			json.push(data);  //往数组里添加每一次的数据
			localStorage.setItem("data",JSON.stringify(json)); //转换成json格式
			});

			//清除缓存内容
			$('#input2').click(function(){  
			var json = JSON.parse(localStorage.getItem("data"));
			localStorage.removeItem("data"); //移除所有的缓存数据
			});
		})
	</script>
</html>