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
兼容性:
相关推荐
"storejs本地存储localstorage的封装提供简单的API没有依赖" 这个标题告诉我们,storejs是一个专门针对浏览器本地存储机制——localStorage的轻量级库。它通过封装localStorage,为开发者提供了更易用的API接口,...
提供get,set,del方法,快捷在本地存储数据,所有浏览器通用(不支持localstorage的,使用cookie保存)
标题“支持设置过期时间的本地存储localStorage”指出了一种改进的本地存储方法,即在使用`localStorage`时加入过期时间的概念。这将帮助我们更好地控制存储在客户端的数据,避免因数据过期而引发的问题,同时减少...
localStorage提供持久化的本地存储,数据在用户关闭浏览器后再打开仍可保留。其主要操作方法包括: - `setItem(key, value)`:用于存储数据,`key`为键,`value`为值。 - `getItem(key)`:根据键获取存储的数据。 - ...
在Vue.js开发中,我们经常需要与浏览器的本地存储机制如localStorage进行交互,用于保存用户数据或应用状态。为了提高代码的可维护性和复用性,开发者会进行二次封装,创建一个专门处理localStorage操作的工具模块。...
1. localStorage是本地存储,存储期限不限; 2. sessionStorage会话存储,页面关闭数据就会丢失。 使用方法: localStorage.setItem(“key”,“value”)//存储 localStorage.getItem(key)//按key进行取值 ...
本文将详细讲解这个名为“本地存储工具”的项目,它提供了一个统一的API来管理和操作`localStorage`和`sessionStorage`。 首先,`localStorage`和`sessionStorage`的主要区别在于数据的生命周期和作用域。`...
一、什么是localStorage? 在HTML5中,新加入了一个localStorage特性,这个特性主要是用来作为...2、localStorage会可以将第一次请求的数据直接存储到本地,这个相当于一个5M大小的针对于前端页面的数据库,相比于cook
Vue2.0 V1.0的增删改查功 全选单选与取消全选选项, 使用了localStorage本地存储数据和watch深度监听数据选项变化。TodoList完善版。 用于学习的小Demo. TodoList 传值学习,父传子 子传孙 子传父 传值等学习,全选...
HTML5的LocalStorage和UserData是两种不同的机制,它们都允许网页在用户本地存储数据,从而实现离线应用或者增强用户体验。这两个技术在实现浏览器兼容性方面起着关键作用,特别是对于那些需要在用户关闭浏览器后...
HTML5的本地存储机制,尤其是LocalStorage,是现代Web开发中不可或缺的一部分,它允许开发者在用户的浏览器上持久化地存储数据,而无需借助于Cookie或Flash等传统方式。LocalStorage的引入,解决了早期存储技术如...
这个系统是基于jQuery 3.4.1版本构建的,旨在帮助用户在本地存储商品选择,即使页面刷新或关闭,购物车中的商品也不会丢失。以下是关于这个项目的详细知识点: 1. **jQuery**:jQuery是一个流行的JavaScript库,它...
在前端开发领域,本地化存储是网页应用保存用户数据的关键技术。主要涉及到两种常见的方法:Cookie和LocalStorage。本文将深入探讨这两种技术的详细用法,帮助开发者更好地理解它们的工作原理和应用场景。 首先,...
一种广泛使用的本地存储方法是使用JavaScript中的localStorage对象。localStorage属于Web Storage的一种,提供了在客户端存储大量数据的能力,并且存储的数据没有过期时间限制,除非我们显式地清除它们。 ### ...
本文将深入探讨“store”这个本地存储实现,以及如何在浏览器不支持localStorage时优雅地降级到使用cookie。 首先,`localStorage`是HTML5引入的一种本地存储机制,它允许Web应用在用户的浏览器上存储大量数据...
总之,`localStorage`和`userData`是JavaScript实现本地存储的两种方式,它们各有优缺点。随着现代浏览器的普及,`localStorage`已经成为更常用的选择,但对于需要兼容旧版IE的场景,`userData`仍然是一个备选方案。...