1.Cookie 
这个恐怕是最常见也是用得最多的技术了,也是比较古老的技术了。COOKIE优点很多,使用起来很方便 
但它的缺点也很多: 
比如跨域访问问题;无法保存太大的数据(最大仅为4KB);本地保存的数据会发送给服务器,浪费带宽 等等;

2.使用sessionStorage、localStorage 
localStorage: 
是一种你不主动清除它,它会一直将存储数据存储在客户端的存储方式,即使你关闭了客户端(浏览器),属于本地持久层储存

sessionStorage: 
用于本地存储一个会话(session)中的数据,一旦会话关闭,那么数据会消失,比如刷新。 
有时候,我们需要将数据存储到sessionStorage和localStorage中,这样做的好处有: 
1 缓存数据 
2 减少对内存的占用 
但是,storage只能存储字符串的数据,对于JS中常用的数组或对象却不能直接存储。 
它能保存更大的数据(IE8上是10MB,Chrome是5MB),同时保存的数据不会再发送给服务器,避免带宽浪费。

localStorage存储方法(sessionStorage类似) 
localStorage.name =’vanida; 
localStorage[“name”]=’vanida’; 
localStorage.setItem(“name”,”vanida”); 
//这三种设置值方式是一样的; 
localStorage获取值方法 
var name = localStorage[“name”] 
var name= localStorage.name 
var name= localStorage.getItem(“name”); 
//这三种获取值方式是一样的; 
localStorage清除特定值方法 
//清除name的值 
localStorage.removeItem(“name”); 
localStorage.name=”; 
localStorage清除所有值方法 
localStorage.clear() 
localStorage只能存储字符串,如果需要存储对象,首先要转化为字符串。利用JSON.stringify(); 
var person = {name:”vanida”,”sex”:”girl”,”age”:25}; 
localStorage.setItem(“person”,JSON.stringify(person)); 
// localStorage.person=”{“name”:”vanida”,”sex”:”girl”,”age”:25}” 
注意:JSON.stringify()中不要忘了“i”,stringify而不是stringfy! 
然后取出person的对象你可以用JSON.parse(); 
person = JSON.parse(localStorage.getItem(“person”));

JS本地保存数据的几种方法的更多相关文章

  1. 77.JS本地保存数据的几种方法

    1.Cookie 这个恐怕是最常见也是用得最多的技术了,也是比较古老的技术了.COOKIE优点很多,使用起来很方便 但它的缺点也很多: 比如跨域访问问题:无法保存太大的数据(最大仅为4KB):本地保存 ...

  2. PHP获取POST数据的几种方法汇总

    一.PHP获取POST数据的几种方法 方法1.最常见的方法是:$_POST['fieldname']; 说明:只能接收Content-Type: application/x-www-form-urle ...

  3. react在router中传递数据的2种方法

    概述 不传递数据叫什么单页面应用,渲染模块还需要http请求算什么单页面应用. 本文总结了react-router4中使用BrowserRouter时传递数据的两种方法,供以后开发参考,相信对其他人也 ...

  4. Asp.Net保存session的三种方法 (Dll文件更新导致session丢失的解决办法)

    1. InProc模式(默认值):asp.net将session保存到当前进程中,这种方式最快,但是不能多台服务器共享session,且会话状态数据容易丢失. <sessionState mod ...

  5. JS实现随机颜色的3种方法与颜色格式的转化

    JS实现随机颜色的3种方法与颜色格式的转化   随机颜色和颜色格式是我们在开发中经常要用到的一个小功能,网上相关的资料也很多,想着有必要总结一下自己的经验.所以这篇文章主要介绍了JS实现随机颜色的3种 ...

  6. 关于Hive创建分区目录且能查到数据的三种方法

    关于Hive创建分区目录且能查到数据的三种方法 1. 使用dfs -mkdir 和 dfs -put 分别创建分区目录和上传数据,此时执行msck repair table 表名 命令就能查询到数据 ...

  7. Vue.js的列表数据的同步更新方法

    这次给大家带来Vue.js的列表数据的同步更新方法,Vue.js列表数据同步更新方法的注意事项有哪些,下面就是实战案例,一起来看一下. 数组的 push(),pop(),shift(),unshift ...

  8. js中判断数据类型的四种方法总结

    js中判断数据类型的四种方法 前言 在js中,我们经常需要判断数据的类型,那么哪些方法可以用来判断数据的类型呢?哪种方法判断数据类型最准确呢? 我们来一个个分析: 1.typeof typeof是一个 ...

  9. SQLServer 批量插入数据的两种方法

    SQLServer 批量插入数据的两种方法-发布:dxy 字体:[增加 减小] 类型:转载 在SQL Server 中插入一条数据使用Insert语句,但是如果想要批量插入一堆数据的话,循环使用Ins ...

随机推荐

  1. windows10 蓝牙(Bluetooth®)设备删除失败解决方案

    某次更新后蓝牙鼠标突然断线无响应,于是尝试删除设备后重新配对,但是出现了删除失败: 这时候可以这样解决: 进入设备管理器(Win+X 设备管理器) 点击 查看 (在最上面一行),选择"显示隐 ...

  2. 一个典型的后台软件系统的设计复盘——(二)如何id一个事物

    这个话题,可以从类与对象说起. Dog dog1 = new Dog(); 哪个是类,哪个是对象?这个问题搞不清楚,后面就无从说起了.然后两个程序员之间沟通说,那个狗有问题.除非两人很默契,不然另一人 ...

  3. Linux 命令行 发送邮件

    1.mail -s hi xx@yy.com 给xx@yy.com发一封主题为hi的信(没有正文) 编辑完内容后Ctrl-D结束. 2.echo "This is a test mail!& ...

  4. PowerDNS简单教程(2):功能篇

    目录: PowerDNS简单教程(1):安装篇 http://www.cnblogs.com/anpengapple/p/5205130.html PowerDNS简单教程(2):功能篇(本篇) Po ...

  5. Django 模型中FileField字段

    FileField¶ class FileField([upload_to=None, max_length=100, **options])¶ 一个上传文件的字段. 注意 FileField字段不支 ...

  6. 牛客网多校训练第一场 I - Substring(后缀数组 + 重复处理)

    链接: https://www.nowcoder.com/acm/contest/139/I 题意: 给出一个n(1≤n≤5e4)个字符的字符串s(si ∈ {a,b,c}),求最多可以从n*(n+1 ...

  7. 20145223 杨梦云 《网络对抗》 Web基础

    20145223 杨梦云 <网络对抗> Web基础 1.实验后回答问题 (1)什么是表单 表单在网页中主要负责数据采集功能.一个表单有三个基本组成部分:(1) 表单标签:这里面包含了处理表 ...

  8. JSON数据转换之net.sf.json包的使用

    转载 解析json之net.sf.json https://blog.csdn.net/itlwc/article/details/38442667 一.介绍 使用之前需要导入的jar包: json- ...

  9. HIDU 2094

    传送门: http://acm.hdu.edu.cn/showproblem.php?pid=2094 产生冠军 Time Limit: 1000/1000 MS (Java/Others)    M ...

  10. STL Vector使用

    http://blog.163.com/zhoumhan_0351/blog/static/399542272010225104536463 Vector 像一个快速的数组,其具有数组的快速索引方式. ...