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

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

代码如下

function SetCookie(name, value) { var key = ''; var Days = 2; var exp = new Date(); var domain = ""; exp.setTime(exp.getTime() + Days * 24 * 60 * 60 * 1000); if (key == null || key == "") { document.cookie = name + "=" + encodeURI(value) + ";expires=" + exp.toGMTString() + ";path=/;domain=" + domain + ";"; } else { var nameValue = GetCookie(name); if (nameValue == "") { document.cookie = name + "=" + key + "=" + encodeURI(value) + ";expires=" + exp.toGMTString() + ";path=/;domain=" + domain + ";"; } else { var keyValue = getCookie(name, key); if (keyValue != "") { nameValue = nameValue.replace(key + "=" + keyValue, key + "=" + encodeURI(value)); document.cookie = name + "=" + nameValue + ";expires=" + exp.toGMTString() + ";path=/;domain=" + domain + ";"; } else { document.cookie = name + "=" + nameValue + "&" + key + "=" + encodeURI(value) + ";expires=" + exp.toGMTString() + ";path=/;" + domain + ";"; } } } }

function GetCookie(name) { var nameValue = ""; var key = ""; var arr, reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)"); if (arr = document.cookie.match(reg)) { nameValue = decodeURI(arr[2]); } if (key != null && key != "") { reg = new RegExp("(^| |&)" + key + "=([^(;|&|=)]*)(&|$)"); if (arr = nameValue.match(reg)) { return decodeURI(arr[2]); } else return ""; } else { return nameValue; } }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”));

下面是单个简单的对象（数组类似）存贮，不考虑其他的多个的情况var obj = { name:'Jim' }; var str = JSON.stringify(obj);

//存入 sessionStorage.obj = str; //读取 str = sessionStorage.obj; //重新转换为对象 obj = JSON.parse(str);--------------------- 作者：周自包 来源： 原文：https://blog.csdn.net/darrenzzb66/article/details/73012577 版权声明：本文为博主原创文章，转载请附上博文链接！

转载于:https://www.cnblogs.com/sqyambition/p/11077778.html