`
zhangyaochun
  • 浏览: 2643802 次
  • 性别: Icon_minigender_1
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

浅谈本地存储之localStorage

阅读更多

localStorage作为HTML5的Web Storage的两种存储方式之一。

 

 

  • 用于持久化本地存储,除非主动删除数据,否则数据是永远不会过期的。
  • 优点:容量大,易用,原生支持
  • 缺点:兼容性问题(IE8以下的版本不支持) | 安全性也差,不适用于保存敏感的数据。
 
1、判断是否支持localStorage
 
 
if(window.localStorage){
   //支持
}else{
  //不支持
}

//或者下面这个
if(typeof window.localStorage == 'undefined'){
   //不支持
}
 
 
2、接口
 
  • localStorage.getItem(key)          ------------获取指定key的本地存储的值
  • localStorage.setItem(key,value)  -----------将value存储到key字段中
  • localStorage.removeItem(key)    ------------删除指定key的本地存储的值
 
注意
  •  localStorage存储的值都是字符串类型,如果你要存储json数据,需要转换一下。
  •  localStorage可以存储多达5M的字符串。会存到一个sqlite的文件中。
  •  localStorage在不同的浏览器中存在不一致的返回值等。
               i.  使用数字索引或者数字字符串索引在FF下赋值没问题,但是获取值方式报错
                     localStorage[1] = 'zhangyaochun'
                     localStorage['1'] = 'fe'
 
               ii. 调用不存在的索引时候FF返回的是Null其他浏览器都是undefined
 
   兼容性
 
 

 
 
 
 
 
 
  • 大小: 77.2 KB
2
1
分享到:
评论

相关推荐

    浅谈cookie和localStorage那些事

    与Cookie相比,localStorage不会随浏览器关闭而消失,而是长期存储在本地,适合存储大量或长期需要的数据。使用`localStorage`接口进行操作: ```javascript localStorage.setItem('key', 'value'); var value = ...

    浅谈移动互联网时代的网络安全.pdf

    一、本地存储未加密隐患。随着HTML5技术的广泛使用,WebStorage成为存储本地数据的关键技术之一,包括SessionStorage和LocalStorage两种。SessionStorage仅用于存储一个会话中的数据,而LocalStorage则用于永久存储...

    HTML5智能手机UI布局浅谈

    WebStorage(包括localStorage和sessionStorage)则为Web应用提供了持久化的本地存储解决方案,使得数据可以在不依赖于服务器的情况下被保存和检索,增强了Web应用的功能性和用户体验。 ### 智能手机Web浏览器的...

    浅谈JavaScript的Polymer框架中的behaviors对象

    但本地存储这个家族可远不止它。以前扯过 sessionStorage,现在还有个神奇的 CacheStorage。它用来存储 Response 对象的。也就是说用来对 HTTP ,响应做缓存的。虽然 localStorage 也能做,但是它可能更专业。  ...

    浅谈vue后台管理系统权限控制思考与实践

    考虑到浏览器的特性,用户可以通过修改本地存储(如localStorage)来绕过权限控制。为解决这个问题,我们需要在用户登录时获取权限列表,并将其存储在Vuex的store中,而不是持久化在客户端。这样,即使页面刷新,...

    HTML 5 新特性介绍(ppt)

    6. **Web Storage**:替代了传统的Cookie,提供了本地存储机制(localStorage和sessionStorage),容量更大,访问速度更快,数据安全性更高。 7. **Web Workers**:通过后台线程执行计算密集型任务,提高网页性能,...

Global site tag (gtag.js) - Google Analytics