本地存储一般体现在搜索记录中，用于方便用户下次搜索

在浏览器的控制台中的Application中查看数据的增删 ，首先先准备四个按钮来控制

<button type="button" onclick="saveDate()">点击存储数据</button>
		<button type="button" onclick="readDate()">点击查看数据</button>
		<button type="button" onclick="deleteDate()">点击删除数据</button>
		<button type="button" onclick="deleteAllDate()">点击清空数据</button>

为他们分别绑定点击事件

存储数据

let p = {name:'Tom',age:18}
			
function saveDate(){
localStorage.setItem('msg','alone');
localStorage.setItem('mag',1921);
localStorage.setItem('person',JSON.stringify(p));
}

点击按钮后在浏览器中就保存了数据，JSON.stringify是为了解析，不让他以{object，object}方式出现，方便阅读，如下图： 

 

 查看数据

function readDate(){
				console.log(localStorage.getItem('msg'));
				console.log(localStorage.getItem('mag'));
				console.log(JSON.parse(localStorage.getItem('person')));
			}

 点击按钮将在控制台打印出结果，对比之后发现确实是之前存在里面的数据

 删除单个数据（或者多个，自己加代码就行）

function deleteDate(){
				localStorage.removeItem('msg');
			}

 这边删掉之前存的msg，在浏览器中显示如图：

发现确实删掉了msg数据

清空数据 （全部清空）

function deleteAllDate(){
				localStorage.clear()
			}

 点击按钮Application中之前存在的数据将全部清空，以上就是localstorage的本地存储