localStorage的使用技巧

╄→尐↘猪︶ㄣ 提交于 2020-02-26 08:10:34
  • 一、关于 localStorage

1、
localStorage是HTML5中新加入的特性,主要作为本地存储来使用,解决了cookie存储空间不足的问题,大约有5M左右,cookie只有4K
2、 localStorage是针对于前端页面的数据库,相比于cookie可以节约带宽, 高版本的浏览器中才支持的 3、
目前所有的浏览器中都会把localStorage的值类型限定为string类型 4、
localStorage在浏览器的隐私模式下面是不可读取的 5、 localStorage不能被爬虫抓取到 6、
localStorage本质上是对字符串的读取,存储内容过多会消耗内存空间,导致页面卡顿 7、 localStorage属于永久性存储

  • 二、使用 localStorage
<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>localStorage学习</title>
	</head>

	<body>
		<script>
			if(!window.localStorage) {
				alert("浏览器不支持localstorage");
			} else {
				var ls = window.localStorage;
				// 增
				ls.setItem('a', 1);
				// 删
				// 1、全部清除
				ls.clear();
				// 2、单个key清除
				ls.removeItem('a');
				// 改
				ls.a = 2;
				// 查
				var a = ls.getItem('a');
				// 输出
				console.log(a);
				// key获取
				for(var i = 0, len = ls.length; i < len; i++) {
					var key = ls.key(i);
					console.log(key);
				}
			}
		</script>
	</body>

</html>

如您在阅读中发现不足,欢迎留言!!!

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!