`
jinhonglin001
  • 浏览: 15161 次
  • 性别: Icon_minigender_1
社区版块
存档分类
最新评论

localstorage的一些方法

阅读更多

   前面说过web storage 这里在回顾一下

  Web Storage实际上由两部分组成:sessionStorage与localStorage。

  sessionStorage用于本地存储一个会话(session)中的数据,这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。因此sessionStorage不是一种持久化的本地存储,仅仅是会话级别的存储。

   localStorage用于持久化的本地存储,除非主动删除数据,否则数据是永远不会过期的。

localStorage的一些增删查改方法:

 (1) : localStorage.getItem(key):获取指定key本地存储的值

 (2) : localStorage.setItem(key,value):将value存储到key字段

 (3) : localStorage.length: 返回本地存储value的长度

(4):localStorage.clear() : 清空local storage

(5):localStorage.removeItem(key) :删除指定key值的键值对

同时需要注意的是localStorage存储的键值对只能是字符串,所以当我们想要存储数组时,需要JSON对象的转变

 

 

<script>
    var obj = [1,2,3,4]
    //存储obj到localStorage
        localStorage.objname = JSON.stringify(obj)
   // 取出值 并且转换为对象
	var new_obj_name=
        JSON.parse(localStorage.getItem("objname"));
 
</script>

  

分享到:
评论

相关推荐

    vue实现localStorage工具类

    - **`getItem`方法**:同样先检查`localStorage`是否可用,然后调用`isExpired`方法判断缓存是否过期。如果过期,则清空所有缓存并返回;若未过期,则根据`key`获取缓存数据,并对数据进行解析(如果数据是以“obj-...

    vue使用二次封装存储localStorage

    在这个例子中,我们定义了`setItem`、`getItem`和`removeItem`三个基本方法,分别对应localStorage的原生方法。由于localStorage只能存储字符串,我们在存入和取出时都进行了JSON序列化和反序列化的处理。 2. 在Vue...

    如何使用localstorage代替cookie实现跨域共享数据问题

    一,背景   因为网站系统的日益庞大,不同域名业务,甚至不同合作方网站的cookie可能或多或少需要进行共享使用,遇到这个情况的时候,大家...背景中说过我们使用localstorage来代替cookie,本身localstorage和cookie

    详解vue中localStorage的使用方法

    在Vue应用中,有时我们需要在用户关闭浏览器后仍能保存一些数据,这时候Web Storage API中的localStorage就派上了用场。localStorage相比传统的Cookie,提供了更大的存储空间(通常为5MB),并且在存储和读取数据时...

    JS localStorage实现本地缓存的方法

    一种广泛使用的本地存储方法是使用JavaScript中的localStorage对象。localStorage属于Web Storage的一种,提供了在客户端存储大量数据的能力,并且存储的数据没有过期时间限制,除非我们显式地清除它们。 ### ...

    localstorage本地存储工具

    提供get,set,del方法,快捷在本地存储数据,所有浏览器通用(不支持localstorage的,使用cookie保存)

    使用localStorage缓存js

    使用 `setItem()` 方法可以将键值对存储到 `localStorage` 中。例如,如果你有一个名为 `app.js` 的JavaScript文件,你可以将它的内容编码为Base64字符串,然后存储: ```javascript const jsCode = 'your_app_js...

    HTML5 LocalStorage 本地存储刷新值还在

    使用方法: localStorage.setItem(“key”,“value”)//存储 localStorage.getItem(key)//按key进行取值 localStorage.valueOf( )//获取全部值 localStorage.removeItem(key)//删除单个值,注意引号 ...

    webSql/LocalStorage

    LocalStorage提供了`localStorage.getItem(key)`用于获取值,`localStorage.setItem(key, value)`用于设置值,`localStorage.removeItem(key)`用于删除键值对,以及`localStorage.clear()`用于清空所有数据的方法。...

    localStorage,sessionStorage的使用

    sessionStorage同样提供了一种存储数据的方法,但是它的特性是会话控制和短期保存。会话控制类似于服务器端的session概念,指的是数据只在当前浏览器的会话中有效。具体来说,一旦窗口、标签页或浏览器被关闭,存储...

    JS中利用localStorage防止页面动态添加数据刷新后数据丢失

    当需要从localStorage中获取数据时,可以使用`localStorage.getItem(key)`方法,它会返回与给定键关联的值。 ### 利用localStorage防止页面刷新数据丢失的实现方法 本文章提到的示例代码中,利用了localStorage来...

    cookie使用,localStorage使用

    在Web开发中,数据存储是不可或缺的一部分,尤其是...对于学习和实践,"CookieTest"这个文件名可能包含了一些关于Cookie测试的代码示例,通过查看和分析这些代码,可以进一步加深对Cookie和localStorage的理解和运用。

    使用Typescript编写更加易用的localStorage和sessionStorage的API

    首先,了解`localStorage`和`sessionStorage`的基本使用方法。这两个API都提供`setItem`、`getItem`、`removeItem`和`clear`等方法,用于存储和获取数据。其中,`localStorage`的数据不会随着浏览器会话的结束而清除...

    cypress-localstorage-commands:使用localStorage方法扩展Cypress的cy命令。 允许在两次测试之间保留localStorage

    用localStorage方法扩展Cypress的cy命令。 允许在测试之间保留localStorage并禁用localStorage。 问题所在 您想在赛普拉斯测试之间保留localStorage。 您要禁用localStorage来检查错误处理。 这个解决方案 该解决...

    localStorage在安卓内内置浏览器中报错解决

    localStorage在安卓内内置浏览器中报错解决,最好的解决的方法

    全浏览器兼容localStorage组件

    这通常涉及到一些技巧,比如使用`try-catch`语句处理可能出现的异常,或者在不支持`localStorage`的浏览器中回退到其他存储方案,如`cookie`或`userData`行为。 组件提供的简化二次包装接口意味着开发者可以更方便...

    VUEX和LocalStorage的应用

    2. **监听状态变化**:使用Vuex的`watch`或`subscribe`方法,可以在状态变化时自动保存到LocalStorage,确保数据实时同步。 3. **错误处理**:考虑到不同浏览器对LocalStorage的兼容性和大小限制,需要在使用时添加...

Global site tag (gtag.js) - Google Analytics