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

来源：互联网发布：淘宝网的案例分析编辑：程序博客网时间：2024/05/23 14:20

方法一：

通过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可用来跨页面传值-状态保持

阅读全文

0 0