为什么要使用LocalStorage：
cookie的存储大小较小
cookie所消耗性能较多
LocalStorage与SessionStorage的区别：
LocalStorage会存储到本地，直到手动清除。
SessionStorage存活在当前页面的生命周期，一旦页面关闭，存储的数据也会消失
LocalStorage的基本使用方法：
存储数据：
localStorage.setItem('key','需要存储的数据');获取数据：
var value=localStorage.getItem('key');删除数据：
localStorage.removeItem('key');案例-离线记事本
index.html
<html>
<head>
<meta charset="utf-8">
<title>随手记</title>
</head>
<body>
<h2>随手记--实时保存</h2>
<div>
<textarea id="content" cols="100" rows="20"></textarea>
</div>
<script src="main.js"></script>
</body>
</html>
main.js
//获取记录内容的文本域
var el=document.querySelector('#content');
//页面载入时，从本地获取存储的数据
el.value=localStorage.getItem('data') || '';
//为文本域dom节点添加blur事件
el.addEventListener('blur',function(){
//获取文本域的内容
var data=el.value;
//保存到本地
localStorage.setItem('data',data);
})
来源：CSDN
作者：孙一phone
链接：https://blog.csdn.net/gansihuangxudong/article/details/79810857