一.使用a标签的href跳转至b页面，在b页面获取a页面带过来的参数

A页面:

1.跳转方法1：
<div>
  <a href='http://www.b.com?from=pageA' target="_blank"></a>
</div>

2.跳转方法2：
<script>
   window.open("http://www.b.com?from=pageA", "_blank");
<script>

B页面获取参数:
<script>
   window.location.href.split("?")[1].split("=")[1];
</script>

这两种跳转方法弊端：由于url传参是有字符限制的，如果参数过多则会被截取，所以只能传少量参数

二、两个页面之间传递长数据

1.使用HTML5中新引入的window.postMessage方法进行数据传递

A页面:
<div onclick='jumpTopageB'></div>

function jumpTopageB(){
    var popup = window.open("http://www.b.com", "_blank");
    if(popup){
      setTimeout(function(){
         var data = {from: pageA};
         popup.postMessage(JSON.stringify(data), "http://www.b.com");
      },500);
    }
 }
 
 B页面获取参数:
 function receiveMessage(event){
    if (event.origin !== "http://www.a.com") return;
    console.log(JSON.parse(event.data)); 
 }
 window.addEventListener("message", receiveMessage, false);

弊端：使用postMessage发送消息时要确保B页面已经加载，由于A和B两个页面是跨域的，所以使用popup.onload是无效的，只能使用setTimeout来延迟发送，setTimeout不能保证稳定性。

2.在A页面中使用iframe标签嵌入B页面

A页面:
   <iframe id="myIframe" src="http://www.b.com" />

   <script>
    let myIframe = document.getElementById("myIframe");
    if (myIframe) {
       var data = {from: pageA};
       myIframe.contentWindow.postMessage(JSON.stringify(data), "http://www.b.com");
}
<script>

弊端：使用iframe标签只能嵌入页面，不能打开新窗口，使用window.open可以打开新窗口，但是，当B页面刚被加载时是没有数据传递的，数据是在窗口打开后才被发送，所以B页面会有延迟。

三、最完美的方案

使用：iframe+postMessage+localStorage

实现思路： 在A页面中使用iframe标签加载B页面并隐藏，当点击跳转时，使用postMessage发送消息给B页面，在B页面中监听A页面发过来的数据，然后保存到localStorage中，当A页面使用window.open打开B页面时，B页面直接去localStorage中取数据，这样就完成了页面跳转并传参

// A页面
<div>
  <span onClick="jumpTopageB();">Jump</span>
  <iframe id="myIframe" src="http://www.b.com" style="display: none" />
</div>
  
<script>
  function jumpTopageB(){
      var myIframe = document.getElementById("myIframe");
      if (myIframe) {
        var data = {data: 1};
        myIframe.contentWindow.postMessage(JSON.stringify(data), "http://b.com");
        window.open("http://www.b.com", "_blank");
       }

    }
<script>

// B页面
<script>
    var aPageData = localStorage.getItem(“aPageData”);
    if(aPageData){
       doSomething(aPageData); // 当能获取到数据时就说明是从A页面跳转过来的
       localStorage.removeItem(“aPageData”);
    }else{
     window.addEventListener(“message”, receiveMessage, false);
    }
    
   function receiveMessage(event){
       if (event.origin !== “http://www.a.com”) return;
       if(event.data){
          localStorage.setItem(“aPageData”, event.data);
       }
    }
   
   function doSomething(aPageData){
     //处理业务逻辑
   }
<script>

两个跨域页面之间传参的完美方案

一.使用a标签的href跳转至b页面，在b页面获取a页面带过来的参数

二、两个页面之间传递长数据

三、最完美的方案