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

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”));

时间: 2024-11-10 22:48:16

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

浏览器保存数据的几种方法

Web产品中很多时候需要在客户端,即浏览器中保存一些必要的数据.而面临这类需求时,你应当知悉对应的解决方案不仅仅只有一种. Cookie 这是最早被使用,且至今仍被广泛采用的最简单的浏览器中保存数据方法. Cookie使用键/值形式存储数据,且数据类型只能为字符串. Cookie相关的CRUD操作: 创建 document.cookie="username=Ken"; 修改 document.cookie="username=Foo"; 和创建Cookie的语法一致

【javascript】js本地保存数据的一个解决方案:localStorage

'localStorage' : localData = {hname : location.hostname ? location.hostname+'/marchsoft/index.php/OA/' : 'localStatus',isLocalStorage : window.localStorage ? true : false,dataDom : null,initDom:function(){ //初始化userDataif(!this.dataDom){try{this.data

Node.JS的表单提交及OnceIO中接受GET/POST数据的三种方法

OnceIO 是 OnceDoc 企业私有内容(文档)管理系统的底层Web框架,它可以实现模板文件.静态文件的全缓存,运行起来完全不需要I/O操作,并且支持客户端缓存优化,GZIP压缩等(只压缩一次),拥有非常好的性能,为您节约服务器成本.它的模块化功能,可以让你的Web进行分布式存储,在一个扩展包里即可包含前端.后端和数据库定义,只需通过添加/删除目录的方式就可实现功能删减,实现真正的模块化扩展.目前 OnceIO 已经开源,本文主要介绍node.js语言中的表单提交及OnceIO中接受GET

用旭日图展示数据的三种方法

什么是旭日图? 旭日图(Sunburst Chart)是一种现代饼图,它超越传统的饼图和环图,能表达清晰的层级和归属关系,以父子层次结构来显示数据构成情况.旭日图中,离远点越近表示级别越高,相邻两层中,是内层包含外层的关系. 在实际项目中使用旭日图,可以更细分溯源分析数据,真正了解数据的具体构成.而且,旭日图不仅数据直观,而且图表用起来特别炫酷,分分钟拉高数据汇报的颜值!很多数据场景都适合用旭日图,比如,在销售汇总报告中,方便看到每个店铺的销售业绩分布(如下图): 做旭日图的三种方法 1. 用E

PHP获取POST数据的几种方法

一.PHP获取POST数据的几种方法 方法1.最常见的方法是:$_POST['fieldname'];说明:只能接收Content-Type: application/x-www-form-urlencoded提交的数据解释:也就是表单POST过来的数据 方法2.file_get_contents("php://input");说明:允许读取 POST 的原始数据.和 $HTTP_RAW_POST_DATA 比起来,它给内存带来的压力较小,并且不需要任何特殊的 php.ini 设置.p

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

一.PHP获取POST数据的几种方法 方法1.最常见的方法是:$_POST['fieldname']; 说明:只能接收Content-Type: application/x-www-form-urlencoded提交的数据解释:也就是表单POST过来的数据 方法2.file_get_contents("php://input"); 说明:允许读取 POST 的原始数据.和 $HTTP_RAW_POST_DATA 比起来,它给内存带来的压力较小,并且不需要任何特殊的 php.ini 设置

js中数组去重的几种方法

js中数组去重的几种方法         1.遍历数组,一一比较,比较到相同的就删除后面的                 function unique(arr){                         for(var i=0;i<arr.length;i++){                                 for(var j=i+1;j<arr.length;j++){                                         if(ar

SQL Server 批量插入数据的两种方法

在SQL Server 中插入一条数据使用Insert语句,但是如果想要批量插入一堆数据的话,循环使用Insert不仅效率低,而且会导致SQL一系统性能问题.下面介绍SQL Server支持的两种批量数据插入方法:Bulk和表值参数(Table-Valued Parameters). 运行下面的脚本,建立测试数据库和表值参数. [c-sharp] view plaincopy --Create DataBase create database BulkTestDB; go use BulkTes

5.MVC框架开发(强类型开发,控制器向界面传递数据的几种方法)

界面表单中的表单元素名字和数据库表的字段名相一一映射(需要哪个表的数据就是那个表的模型(Model)) 在View页面中可以指定页面从属于哪个模型 注:以上的关系可以通过MVC的强类型视图开发来解决我们的开发代码的智能感知 1.强类型视图开发的步骤 1)在页面中指定强类型的类型(一定是引用类型),代码:例: @model List<MyMVCBookShop.Models.Book> 2)从控制器传强类型的数据到View视图里,那么就必须保证传入的数据一定和强类型视图中定义的类型相一致,例: