html页面之间传递参数的方法有哪些

1、通过form表单传递参数

<code class="hljs xml has-numbering" style="display: block; padding: 0px; color: inherit; box-sizing: border-box; font-family: 'Source Code Pro', monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal; background: transparent;"><span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">html</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">lang</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"en"</span>></span>
    <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">head</span>></span>
    <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;"><!--网站编码格式，UTF-8 国际编码，GBK或 gb2312 中文编码--></span>
        <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">meta</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">http-equiv</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"content-type"</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">content</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"text/html;charset=utf-8"</span> /></span>
        <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">meta</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">name</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"Keywords"</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">content</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"关键词一，关键词二"</span>></span>
        <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">meta</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">name</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"Description"</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">content</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"网站描述内容"</span>></span>
        <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">meta</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">name</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"Author"</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">content</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"Yvette Lau"</span>></span>
        <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">title</span>></span>Document<span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">title</span>></span>
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;"><!--css js 文件的引入--></span>
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;"><!-- <link rel="shortcut icon" href="images/favicon.ico">        --></span>
        <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">link</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">rel</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"stylesheet"</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">href</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">""</span>/></span>
        <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">script</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">type</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">text</span>/<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">javascript</span>" <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">src</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">jquery-1.11.2.min.js</span>"></span><span class="javascript" style="box-sizing: border-box;"></span><span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">script</span>></span> 
    <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">head</span>></span>
    <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">body</span>></span>      
        <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">form</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">name</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">frm</span>" <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">method</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">get</span>" <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">action</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">receive.html</span>" <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">onsubmit</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">return</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">foo</span>()" <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">style</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">position:relative</span>;"></span>
            <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">input</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">type</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"hidden"</span>  <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">name</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"hid"</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">value</span> = "" <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">index</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">lemon</span>"></span> 
            <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">img</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">class</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">more</span>" <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">src</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">main_jpg10.png</span>" /></span>
            <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">input</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">type</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">submit</span>" <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">style</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">position:absolute</span>;<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">left:10px</span>;<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">top:0px</span>;<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">width:120px</span>;<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">height:40px</span>;<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">opacity:0</span>;<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">cursor:pointer</span>;"/></span>
        <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">form</span>></span>     
        <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">form</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">name</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">frm</span>" <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">method</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">get</span>" <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">action</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">receive.html</span>" <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">onsubmit</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">return</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">foo</span>()" <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">style</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">position:relative</span>;"></span>
            <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">input</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">type</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"hidden"</span>  <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">name</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"hid"</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">value</span> = "" <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">index</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">aaa</span>"></span> 
            <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">img</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">class</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">more</span>" <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">src</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">main_jpg10.png</span>" /></span>
            <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">input</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">type</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">submit</span>" <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">style</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">position:absolute</span>;<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">left:10px</span>;<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">top:0px</span>;<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">width:120px</span>;<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">height:40px</span>;<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">opacity:0</span>;<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">cursor:pointer</span>;"/></span>
        <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">form</span>></span>
        <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">form</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">name</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">frm</span>" <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">method</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">get</span>" <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">action</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">receive.html</span>" <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">onsubmit</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">return</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">foo</span>()" <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">style</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">position:relative</span>;"></span>
            <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">input</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">type</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"hidden"</span>  <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">name</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"hid"</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">value</span> = "" <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">index</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">bbb</span>"></span> 
            <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">img</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">class</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">more</span>" <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">src</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">main_jpg10.png</span>" /></span>
            <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">input</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">type</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">submit</span>" <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">style</span> = "<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">position:absolute</span>;<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">left:10px</span>;<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">top:0px</span>;<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">width:120px</span>;<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">height:40px</span>;<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">opacity:0</span>;<span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">cursor:pointer</span>;"/></span>
        <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">form</span>></span>
    <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">body</span>></span>
<span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">html</span>></span>
<span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">script</span>></span><span class="javascript" style="box-sizing: border-box;">
    <span class="hljs-function" style="box-sizing: border-box;"><span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">function</span> <span class="hljs-title" style="box-sizing: border-box;">foo</span><span class="hljs-params" style="color: rgb(102, 0, 102); box-sizing: border-box;">()</span>{</span>
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">var</span> frm = window.event.srcElement;
        frm.hid.value = $(frm.hid).attr(<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"index"</span>); 
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">return</span> <span class="hljs-literal" style="color: rgb(0, 102, 102); box-sizing: border-box;">true</span>;
    }
</span><span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">script</span>></span></code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right; background-color: rgb(238, 238, 238);"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li><li style="box-sizing: border-box; padding: 0px 5px;">6</li><li style="box-sizing: border-box; padding: 0px 5px;">7</li><li style="box-sizing: border-box; padding: 0px 5px;">8</li><li style="box-sizing: border-box; padding: 0px 5px;">9</li><li style="box-sizing: border-box; padding: 0px 5px;">10</li><li style="box-sizing: border-box; padding: 0px 5px;">11</li><li style="box-sizing: border-box; padding: 0px 5px;">12</li><li style="box-sizing: border-box; padding: 0px 5px;">13</li><li style="box-sizing: border-box; padding: 0px 5px;">14</li><li style="box-sizing: border-box; padding: 0px 5px;">15</li><li style="box-sizing: border-box; padding: 0px 5px;">16</li><li style="box-sizing: border-box; padding: 0px 5px;">17</li><li style="box-sizing: border-box; padding: 0px 5px;">18</li><li style="box-sizing: border-box; padding: 0px 5px;">19</li><li style="box-sizing: border-box; padding: 0px 5px;">20</li><li style="box-sizing: border-box; padding: 0px 5px;">21</li><li style="box-sizing: border-box; padding: 0px 5px;">22</li><li style="box-sizing: border-box; padding: 0px 5px;">23</li><li style="box-sizing: border-box; padding: 0px 5px;">24</li><li style="box-sizing: border-box; padding: 0px 5px;">25</li><li style="box-sizing: border-box; padding: 0px 5px;">26</li><li style="box-sizing: border-box; padding: 0px 5px;">27</li><li style="box-sizing: border-box; padding: 0px 5px;">28</li><li style="box-sizing: border-box; padding: 0px 5px;">29</li><li style="box-sizing: border-box; padding: 0px 5px;">30</li><li style="box-sizing: border-box; padding: 0px 5px;">31</li><li style="box-sizing: border-box; padding: 0px 5px;">32</li><li style="box-sizing: border-box; padding: 0px 5px;">33</li><li style="box-sizing: border-box; padding: 0px 5px;">34</li><li style="box-sizing: border-box; padding: 0px 5px;">35</li><li style="box-sizing: border-box; padding: 0px 5px;">36</li><li style="box-sizing: border-box; padding: 0px 5px;">37</li><li style="box-sizing: border-box; padding: 0px 5px;">38</li></ul>

点击图片时，跳转至receive.html页面。页面的url变成： 
 
我们想要传的字符串已经传递了过来。 
然后再对当前的url进行字符串分割 
window.location.href.split(“=”)[1]//得到lemon 
我们拿到需要传来的参数之后，就可以根据这个进行下一步的处理了。 
除了上述通过字符串分割来获取url传递的参数外，我们还可以通过正则匹配和window.location.search方法来获取。

2、通过window.location.href

譬如我们点击某个列表，需要传递一个字符串到detail.html页面，然后detail.html页面根据传来的值，通过ajax交互数据，加载页面的内容。

var index = "lemon"; var url = "receive.html?index="+index; $("#more").click(function(){ window.location.href = url; });

当前页面会被替换成recieve.html的页面，页面的url变为： 
 
然后我们再用上面的方法提取自己需要的参数

3、通过window.location.open

如果是希望打开一个新页面，而不是改变当前的页面，那么window.location.href就不适用了，此时，我们需要借助于window.location.open()来实现 
简单介绍有一下window.open()函数，window.open()有三个参数，第一个参数是要打开的页面的url,第二个参数是窗口目标，第三个参数是一个特定字符串以及一个表示新页面是否取代浏览器历史集中当前加载页面的布尔值，通过只需要传递第一个参数。第二个参数还可以是”_blank”,”_self”,”_parent”,”_top”这样的特殊窗口名称，”_blank”打开新窗口,”_self”实现的效果同window.location.href. 
继续上面的例子：

<code class="hljs xml has-numbering" style="display: block; padding: 0px; color: inherit; box-sizing: border-box; font-family: 'Source Code Pro', monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal; background: transparent;"><span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">script</span>></span><span class="javascript" style="box-sizing: border-box;">
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">var</span> index = <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"lemon"</span>;
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">var</span> url = <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"receive.html?index="</span>+index;
    $(<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"#more"</span>).click(<span class="hljs-function" style="box-sizing: border-box;"><span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">function</span><span class="hljs-params" style="color: rgb(102, 0, 102); box-sizing: border-box;">()</span>{</span>
        window.open(url)
    });
</span><span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">script</span>></span></code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right; background-color: rgb(238, 238, 238);"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li><li style="box-sizing: border-box; padding: 0px 5px;">6</li><li style="box-sizing: border-box; padding: 0px 5px;">7</li></ul>

这样在点击的时候，就会打开一个新页面，页面的url地址与上面相同。 
由于浏览器的安全限制，有些浏览器在弹出窗口配置方面增加限制，大多数浏览器都内置有弹出窗口的屏蔽程序，因此，弹出窗口有可能被屏蔽，在弹出窗口被屏蔽时，需要考虑两种可能性，一种是浏览器内置的屏蔽程序阻止弹出窗口，那么 window.open()很可能返回Null，此时，只要监测这个返回的值就可以确定弹出窗口是否被屏蔽。

<code class="hljs coffeescript has-numbering" style="display: block; padding: 0px; color: inherit; box-sizing: border-box; font-family: 'Source Code Pro', monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal; background: transparent;"><span class="hljs-reserved" style="box-sizing: border-box;">var</span> newWin = <span class="hljs-built_in" style="color: rgb(102, 0, 102); box-sizing: border-box;">window</span>.open(url);
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">if</span>(newWin == <span class="hljs-literal" style="color: rgb(0, 102, 102); box-sizing: border-box;">null</span>){
    alert(<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"弹窗被阻止"</span>);
}</code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right; background-color: rgb(238, 238, 238);"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li></ul>

另一种是浏览器扩展或其他程序阻止的弹出窗口，那么window.open()通常会抛出一个错误，因此，要像准确的检测弹出窗口是否被屏蔽，必须在检测返回值的同时，将window.open()封装在try-catch块中，上面的例子中可以写成如下形式：

<code class="hljs xml has-numbering" style="display: block; padding: 0px; color: inherit; box-sizing: border-box; font-family: 'Source Code Pro', monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal; background: transparent;"><span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">script</span>></span><span class="javascript" style="box-sizing: border-box;">
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">var</span> blocked = <span class="hljs-literal" style="color: rgb(0, 102, 102); box-sizing: border-box;">false</span>;
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">try</span>{
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">var</span> index = <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"lemon"</span>;
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">var</span> url = <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"receive.html?index="</span>+index;
        $(<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"#more"</span>).click(<span class="hljs-function" style="box-sizing: border-box;"><span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">function</span><span class="hljs-params" style="color: rgb(102, 0, 102); box-sizing: border-box;">()</span>{</span>
           <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">var</span> newWin = window.open(url);
           <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">if</span>(newWin == <span class="hljs-literal" style="color: rgb(0, 102, 102); box-sizing: border-box;">null</span>){
               blocked = <span class="hljs-literal" style="color: rgb(0, 102, 102); box-sizing: border-box;">true</span>;
           }
        });
    } <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">catch</span>(ex){
        block = <span class="hljs-literal" style="color: rgb(0, 102, 102); box-sizing: border-box;">true</span>;
    }
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">if</span>(blocked){
        alert(<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"弹出窗口被阻止"</span>);
    }    
</span><span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">script</span>></span></code>