本地存储 localStorage，本地存储 sessionStorage 的使用原理方法

文章作者：痴迷

本地存储，随着互联网的快速发展，会经常使用到本地存储，本地存储的数据是存储的浏览器的空间中，每个浏览器中的本地存储规格都不一样，本地存储是方便存储一下较小的数据，但是这些数据又不太方便使用的时候，就会......

本地存储，随着互联网的快速发展，会经常使用到本地存储，本地存储的数据是存储的浏览器的空间中，每个浏览器中的本地存储规格都不一样，本地存储是方便存储一下较小的数据，但是这些数据又不太方便使用的时候，就会使用到本地存储
一，本地存储（localStorage，sessionstorage）的一些特性
1.数据存储在浏览器中
2.存储大小有限制，一般sessionstorage大约5m左右，localstorage大约在20m左右（各个浏览器有所不同）
3.读取方便，设置删除简单
4.生命周期（sessionstorage是临时存储，浏览器一关闭，数据就会自动清楚。localstorage是长期存储，与sessionstorage一样，但是生命周期：就算浏览器关闭也会存在，除非手动清楚数据）
5.只能存储字符串，json，对象（json.stringify转换成功json字符串）
6.查看，本地存储（浏览器按F12 => 进入调试模式 => 点 Applicaton =>就会看到 localstorage和sessionstorage ）

二，使用方法和命令（因为localstorage和sessionstorage的使用方法是一样的这里就一起写了）

1.设置数据 setItem('键名','值')

				    <script>
			
				        //一，存储字符串     
			
				        //1.要存储的数据 
			
				        let sum = '123456789';
			
				        //使用setItem命令存储 
			
				        // setItem('键名','值')，符合键值对要求 
			
				        sessionStorage.setItem('id', sum);
			
				        localStorage.setItem('id', sum);
			
				        //二，存储字对象，必须使用json.stringify转换成 json字符串     
			
				        //1.要存储的数据 
			
				        let con = {
			
				            name: '张三',
			
				            age: '18' 
			
				        };
			
				        //使用setItem命令存储 
			
				        sessionStorage.setItem('key', JSON.stringify(con));
			
				        localStorage.setItem('key', JSON.stringify(con));
			
				    </script>

2.获取数据setItem('键名'）

		    <script>
	
		        //从本地存储获取数据 
	
		        let id = sessionStorage.getItem('id');
	
		        let ids = localStorage.getItem('id');
	
		    </script>

3.删除数据 setItem('键名'）

		    <script>
	
		        //从本地存储删除数据 
	
		        sessionStorage.removeItem('id');
	
		        localStorage.removeItem('id');
	
		    </script>

4.清空所有数据 clear()

		    <script>
	
		        //清空数据 
	
		        sessionStorage.clear();
	
		        localStorage.clear();
	
		    </script>

5.本地存储的时间监听

		    <script>
	
		        // Storage 发生变化（增加、更新、删除）时的 触发 
	
		        window.addEventListener('storage', function(e) {
	
		            console.log(e.key);
	
		            console.log(e.url);
	
		        });
	
		    </script>