如何通过localStorage存储数据以减少请求？

Question

一个菜单，点击左侧菜单动态请求数据加载然后显示在右侧。点击菜单一就请求然后显示菜单一相应的数据，点击菜单二就请求然后显示菜单二相应的数据。。。把加载的所有数据（html字符串）放在ul标签里面。之前没有用过localStorage实现过这个，搞不懂点击事件与存储之间实现的先后关系和具体实现。比例点击左侧菜单，如何判断之前点击过所以本地有存储，而直接从localstorage里面取呢？

Answer 1

localStorage提供了几个api 
localStorage.getItem(key) //获取存储内容
localStorage.setItem(key,value) //设置存储内容
localStorage.removeItem(key) //清除存储的某个内容
localStorage.clear() //清除所有内容

点击之前先获取指定的内容 如果返回null则没有存储过 将拿到的结果渲染DOM并存在localStorage里
再次点击的时候依然先取本地存的内容获取到了就渲染 同时请求内容更新本地存储再次渲染这样的逻辑

如果时效性比较高变化很快的没有必要存起来 更新不频繁的可以考虑缓存 存内容的时候建议维护一个更新时间字段 定期去获取一下内容 这个很具自己的业务需求来

localStorage存储的内容都是字符串 可以用JSON.stringify 和 JSON.parse来存储json对象