前端存储数据方法:
1 本地存储
2 临时存储
3 cookie存储
本地存储:
顾名思义就是把数据存储在手机/电脑本机内,不手动删除/代码删除会一直存在
存储大小:5MB以下
localStorage.length //获取storage中的个数
localStorage.key(n) //获取storage中第n个元素对的键值(第一个元素是0)
localStorage.getItem(key) //获取键值key对应的值
localStorage.key //获取键值key对应的值
localStorage.setItem(key, value) //添加数据,键值为key,值为value
localStorage.removeItem(key) //移除键值为key的数据
localStorage.clear() //清除所有数据
临时存储:
和本地存储类似,也是把数据存储在手机/电脑内,但是他会在会话关闭/结束后清除数据
存储大小:5MB以下
sessionStorage.length // 获取 storage 的个数
sessionStorage.key(n) // 获取 storage 中第 n 个元素对的键值
sessionStorage.getItem(key) // 获取 key 对应的值
sessionStorage.key // 获取键值 key 对应的值
sessionStorage.setItem(key, value) // 添加数据,键值为 key,值为 value
sessionStorage.removeItem(key) // 移除键值为 key 的值
sessionStorage.clear() // 清除所有数据
cookie存储:
存储大小:4k以下
//取得cookie
function getCookie(name) {
var nameEQ = name + "=";
var ca = document.cookie.split(';'); //把cookie分割成组
for (var i = 0; i < ca.length; i++) {
var c = ca[i]; //取得字符串
while (c.charAt(0) == ' ') { //判断一下字符串有没有前导空格
c = c.substring(1, c.length); //有的话,从第二位开始取
}
if (c.indexOf(nameEQ) == 0) { //如果含有我们要的name
return unescape(c.substring(nameEQ.length, c.length)); //解码并截取我们要值
}
}
return false;
}
//清除cookie
function clearCookie(name) {
setCookie(name, "", -1);
}
//设置cookie
function setCookie(name, value, seconds) {
seconds = seconds || 0; //seconds有值就直接赋值,没有为0,这个根php不一样。
var expires = "";
if (seconds != 0) { //设置cookie生存时间
var date = new Date();
date.setTime(date.getTime() + (seconds * 1000));
expires = "; expires=" + date.toGMTString();
}
document.cookie = name + "=" + escape(value) + expires + "; path=/"; //转码并赋值
}