前端传值问题(cookie,localstorage)

来源 ：b站 https://www.bilibili.com/video/BV1rp4y1t7Ks?p=73

1.cookie

工具方法封装

var operator = "=";

function getCookieValue(keyStr){
	var value = null;
	var s = window.document.cookie;
	var arr = s.split("; ");
	for(var i=0; i<arr.length; i++){
		var str = arr[i];
		var k = str.split(operator)[0];
		var v = str.split(operator)[1];
		if(k == keyStr){
			value = v;
			break;
		}
	}
	return value;
}

function setCookieValue(key,value){
	document.cookie = key+operator+value;
}

• A页面调用(前提要导入javascript工具包)
  
• B页面
  

2.localstorage

自带方法

• A页面(必须用json字符串设置值，要不然接收不到)
  
• B页面(移除键值对原因是防止下一次访问存值)
  

3.区别

• 最根本区别为cookie能向后端传值，而后者不能,专门用来存放前端的数据
• cookie容量小，后者大
• localStorage与sessionStorage最大区别为生命周期，前者更长。