html頁面跳轉傳遞參數

頁面跳轉的時候可能需要一些數據的傳輸羹应,如商品跳轉到詳情頁需要傳一個id過去。那么在html中如何來實現呢裸违?
簡單的來說就是通過location.href設置路徑的時候通過?拼接的形式拼接進去一些參數供汛。然后在b頁面通過地址欄的信息來拿到這些參數紊馏,從而進行不同的數據渲染朱监。
例子:
a頁面內容:

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <script src="js/jquery-3.0.0.min.js"></script>
    <script src="js/jquery.params.js"></script>
    <title>a頁面</title>
    <script>
        $(function(){
             name = $("#name").text();
             age = $("#age").text();
 
            $("#btn").on("click",function(){
               jump1();
            });
        });
 
        function jump1(){
            url = "b.html?name="+name+"&age="+age;//此處拼接內容
            window.location.href = url;
        }
    </script>
</head>
<body>
   <div id="name">tony</div>
   <div id="age">23</div>
   <button id="btn">跳轉</button>
</body>
</html>

地址欄為:file:///C:/Users/%E5%88%98%E6%AC%A2/Desktop/prctise/a.html

b頁面:

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <script src="js/jquery-3.0.0.min.js"></script>
    <script src="js/jquery.params.js"></script>
    <title>b頁面</title>
    <script>
        $(function(){
           getData1();
        });
 
        function getData1(){
            var name = $.query.get("name");
            var age = $.query.get("age");
 
            $("#name").text(name);
            $("#age").text(age);
        }
    </script>
</head>
<body>
   <div id="name"></div>
   <div id="age"></div>
</body>
</html>

地址欄為:file:///C:/Users/%E5%88%98%E6%AC%A2/Desktop/prctise/b.html?name=tony&age=23

轉載自:https://www.cnblogs.com/chensihan/p/6812678.html

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
  • 序言:七十年代末擂送,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌蟀拷,老刑警劉巖,帶你破解...
    沈念sama閱讀 206,311評論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現場離奇詭異此衅,居然都是意外死亡挡鞍,警方通過查閱死者的電腦和手機默伍,發(fā)現死者居然都...
    沈念sama閱讀 88,339評論 2 382
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來掐隐,“玉大人,你說我怎么就攤上這事探颈。” “怎么了?”我有些...
    開封第一講書人閱讀 152,671評論 0 342
  • 文/不壞的土叔 我叫張陵纱兑,是天一觀的道長潜慎。 經常有香客問我钓瞭,道長堤结,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 55,252評論 1 279
  • 正文 為了忘掉前任鳞溉,我火速辦了婚禮瘾带,結果婚禮上,老公的妹妹穿的比我還像新娘熟菲。我一直安慰自己看政,他們只是感情好,可當我...
    茶點故事閱讀 64,253評論 5 371
  • 文/花漫 我一把揭開白布抄罕。 她就那樣靜靜地躺著允蚣,像睡著了一般。 火紅的嫁衣襯著肌膚如雪呆贿。 梳的紋絲不亂的頭發(fā)上嚷兔,一...
    開封第一講書人閱讀 49,031評論 1 285
  • 那天,我揣著相機與錄音,去河邊找鬼冒晰。 笑死同衣,一個胖子當著我的面吹牛,可吹牛的內容都是我干的壶运。 我是一名探鬼主播乳怎,決...
    沈念sama閱讀 38,340評論 3 399
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼前弯!你這毒婦竟也來了?” 一聲冷哼從身側響起秫逝,我...
    開封第一講書人閱讀 36,973評論 0 259
  • 序言:老撾萬榮一對情侶失蹤恕出,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后违帆,有當地人在樹林里發(fā)現了一具尸體浙巫,經...
    沈念sama閱讀 43,466評論 1 300
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 35,937評論 2 323
  • 正文 我和宋清朗相戀三年刷后,在試婚紗的時候發(fā)現自己被綠了的畴。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 38,039評論 1 333
  • 序言:一個原本活蹦亂跳的男人離奇死亡尝胆,死狀恐怖丧裁,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情含衔,我是刑警寧澤煎娇,帶...
    沈念sama閱讀 33,701評論 4 323
  • 正文 年R本政府宣布,位于F島的核電站贪染,受9級特大地震影響缓呛,放射性物質發(fā)生泄漏。R本人自食惡果不足惜杭隙,卻給世界環(huán)境...
    茶點故事閱讀 39,254評論 3 307
  • 文/蒙蒙 一哟绊、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧痰憎,春花似錦票髓、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,259評論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至涡拘,卻和暖如春玲躯,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,485評論 1 262
  • 我被黑心中介騙來泰國打工跷车, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留棘利,地道東北人。 一個月前我還...
    沈念sama閱讀 45,497評論 2 354
  • 正文 我出身青樓朽缴,卻偏偏與公主長得像善玫,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子密强,可洞房花燭夜當晚...
    茶點故事閱讀 42,786評論 2 345

推薦閱讀更多精彩內容

  • 科學家利用新的測光方法發(fā)現昴星團中的亮星為變星 昴星團是北天著名的年輕疏散星團或渤,年齡約為10億年系冗,包含有上百顆恒星...
    小天學天文閱讀 437評論 0 0
  • 我總愛去讀夜的憂傷 寂靜的星空和殘缺的月 我總愛去讀雨后的那一縷清新 惆悵的柳絲和洗凈的泥濘 我總愛去讀夢過的痕跡...
    薇薇成子閱讀 482評論 1 4
  • 初學者~ 小時最愛的美少女戰(zhàn)士 求指點
    Ty_lily閱讀 265評論 0 0