热门关键字:
jquery > jquery教程 > jquery教程 > HTML5的本地存储localStorage以及简单应用

HTML5的本地存储localStorage以及简单应用

446
作者:管理员
发布时间:2021/4/21 17:54:22
评论数:0
转载请自觉注明原文:http://www.jq-school.com/Show.aspx?id=4528
  localStorage是HTML5中作为在客户端持久保存数据的方案,与cookie相比,localStorage不用在客户端与服务器之间相互传递,且可存储大量数据(2.5MB-5MB),所以应用范围更广泛。


  由于许多老式浏览器不支持localStorage,所以要先写个函数判断浏览器是否支持该对象。


  如果运行该函数,返回值为true,那么恭喜你,可以运用本地存储了。


  localStorage有两个方法用于读取和存储数据,还有一个方法用于删除数据。


  不过这两个方法在实际应用中很少用到,我们一般都是直接采用直接访问属性的方法来读取和设置。


  为了方便理解,我简单的写一个关于localStorage的demo供大家参考


  一个span显示数字,一个按钮,点击按钮使数字改变,并存储到localstorage中。


  当首次运行页面时,通过开发工具可以看到localstorage中有一个counter被设置为了0。


  当点击时,不仅页面中数字发生了变化,localStorage对象中的属性也发生了变化。


  这就是localStorage的简单应用,其实在日常开发中还有很多应用,比如离线购物车。




如果您觉得本文的内容对您的学习有所帮助:支付鼓励



关键字:jquery
友荐云推荐