跨页面传值的几种简单方式

方法一：

通过URL传值

eg:

location.href="跨页面1-2.html?age=18&gender=man";

//1、location.search获取get请求的参数   获取到的数据，是以?开头的
var search=location.search;
//2、如果还想要获取确定的数据，可以解析字符串
function parse(search){//从第二个字符开始截取   ，获取到第二个开始后面所有的字符var str=search.substring(1);var result={};//分割字符串  -->产生字符串数组var strs=str.split("&");//遍历数组中的每一个元素strs.forEach(function(v){//伪代码：v="age=18"var keyvalue=v.split("=");var name=keyvalue[0];var value=keyvalue[1];result[name]=value;})return result;
}var r=parse(search);

方法二：

使用h5的localStorage，或者sessionStorage存储对象类型

存储对象的正确的方式：
var p2={name:"周瑜",age:16};
var s2=JSON.stringify(p2);      //将对象"序列化"为JSON数据(字符串格式)
localStorage.setItem("p2",s2);  //以字符串格式存储信息
var s2_2=localStorage.getItem("p2");    //获取存储的信息，也是字符串格式
var p2_2=JSON.parse(s2_2);      //将JSON数据反序列化为对象

localStroage和sessionStorage使用大致相同，他们的不同之处在于，localstroage是永久保存，而sessionstroage是会话存在，

当会话结束，sessionstroage保存值也会清空。

方法三：

使用cookie保存：

原生cookie

//1、保存一条数据
document.cookie="name=abc";
document.cookie="age=18";
//2、获取所有数据
var cookie=document.cookie;
console.log(cookie);  //"name=abc; age=18; PHPSESSID=fr1njdv6apf3neoj5nehntrps7"
//之后可以解析字符串，获取指定的数据内容
//3、设置cookie的有效期
document.cookie="id=666;expires="+new Date("2017-10-22 08:00");

jQuery.cookie.js插件

 //第一种类型：会话cookie
//    //1、设置值
//    $.cookie("phone","13188886666");
//    $.cookie("email","123@qq.com");
//    //2、获取值
//    var phone=$.cookie("phone");
//    console.log(phone);
//    var email=$.cookie("email");
//    console.log(email);
    //第二种类型：设置长期cookie(具有指定有效期)
//    $.cookie("address","广东深圳市",{
//        expires:7               //expires不仅仅可以是日期类型的对象，也可以是以天为单位的数字
//    });
//    $.cookie("tel","0755-88888888",{
//        expires:1/24              //该cookie值就会保存一小时
//    });
//    $.cookie("birthday","1.1",{
//        expires:new Date("2018-01-01 08:00")        //对于这样的过期时间，已经在内部处理好了时区问题
//    });
    //删除指定的cookie
    $.removeCookie("birthday");

使用cookie可用来跨页面传值-状态保持

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！