js實現頁面與頁面之間傳值的幾種方法優劣

來源:互聯網
上載者:User

標籤:local   sub   span   ring   mat   function   運行   parse   速度   

1. cookie 傳值, 缺點: cookie儲存是需要伺服器支援的,本地直接運行靜態檔案是實現不了的

<script>        //添加 cookiefunction cp_add_cookie(num){setCookie("cp_keynum",num,2);}//尋找function cp_seek_cookie(){var cp_keynum=getCookie("cp_keynum");var find_result = document.getElementById("find_result2");find_result.innerHTML = "cp_keynum == " + cp_keynum;  }  //設定 cookie 值的函數,建立一個函數用於儲存訪問者的名字function setCookie(cname,cvalue,exdays){    var d = new Date();    d.setTime(d.getTime()+(exdays*24*60*60*1000));    var expires = "expires="+d.toGMTString();    document.cookie = cname+"="+cvalue+"; "+expires;}//擷取 cookie 值的函數,建立一個函數使用者返回指定 cookie 的值function getCookie(cname){    var name = cname + "=";    var ca = document.cookie.split(‘;‘);    for(var i=0; i<ca.length; i++) {        var c = ca[i].trim();        if (c.indexOf(name)==0) return c.substring(name.length,c.length);    }    return "";} </script>

 

2. LocalStorage和SessionStorage傳值, 優點:本地靜態檔案可支援

if(typeof(Storage)=="undefined"){  document.getElementById("result").innerHTML="對不起,您的瀏覽器不支援 web 儲存。";}//儲存資料  function save(cp_value){      var num = new Object;    num.cp_keynum ="key_num";      num.cp_num_value = cp_value;    var str = JSON.stringify(num); // 將對象轉換為字串    localStorage.setItem(num.cp_keynum,str);    alert("添加成功");} //尋找資料  function find(){      var cp_keynum = "key_num";      var str = localStorage.getItem(cp_keynum);      var find_result = document.getElementById("find_result");    var num = JSON.parse(str);      find_result.innerHTML = cp_keynum + "==" + num.cp_num_value;  }  

 

3. Url傳值. 優點: 速度快. cookie 和 LocalStorage和SessionStorage 都存在速度慢,反應不過來的問題, 我在a頁面寫進去,在b頁面讀出來.有時會讀到空值.

    function getUrlParam(name){        //Regex過濾        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");                console.log("location.search==="+location.search);        //substr(1):從字串第一個位置中提取一些字元        console.log("location.search.substr(1)==="+location.search.substr(1));        //match():在字串內檢索與Regex匹配的指定值,返回一個數組給r        console.log("window.location.search.substr(1).match(reg)==="+window.location.search.substr(1).match(reg));        var r = window.location.search.substr(1).match(reg);         //擷取r數組中下標為2的值;(下標從0開始),用decodeURI()進行解碼        console.log("decodeURI(r[2])==="+decodeURI(r[2]));       if (r != null) return decodeURI(r[2]); return null; 

}

 

js實現頁面與頁面之間傳值的幾種方法優劣

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.