Home > Developer > Web Develop
For a long time did not write a blog, the value of 51, outside the crowded, the baby is still good to stay at home to study it. Okay, here we are. In the absence of background support, how do you implement data from a page like another page? Many people should have encountered this problem. Let me say how I solved it when I met in the project.
For example, there are two pages, page1.html, and page2.html, which pass the hash value on the Page1 page to the Page2 page. On the code:
Page1.html's Code:
1 <!DOCTYPE HTML>2 <HTMLLang= "en">3 <Head>4 <MetaCharSet= "UTF-8">5 <title>Page 1</title>6 <style>7 *{8 margin:0;9 padding:0;Ten } One </style> A </Head> - <Body> - <ahref= "Index2.html#id1">Jump to Box1 Place</a> the <ahref= "Index2.html#id2">Jump to Box2 Place</a> - - </Body> - <Script> + window.onload= function(){ - } + </Script> A </HTML>
Page2.html Code:
1 <!DOCTYPE HTML>2 <HTMLLang= "en">3 <Head>4 <MetaCharSet= "UTF-8">5 <title>Page 2</title>6 <style>7 #id1{8 width:100px;9 Height:100px;Ten background:Red; One } A - #id2{ - width:100px; the Height:100px; - background:Pink; - } - </style> + </Head> - <Body> + <DivID= "Id1">Box1</Div> A <Divstyle= "width:10px;height:10px;margin-bottom:1000px;"></Div> at <DivID= "Id2">Box2</Div> - </Body> - <Script> - window.onload= function () { - Console.log (window.location.href)//the href value of the current page is printed here, for http://localhost:63342/HTML_ExamplePractice/%E5%8D%9A%E5%AE%A2%E5%9B%AD%E6%8F%90%E5%89% 8D%E7%BB%83%E4%B9%A0/INDEX2.HTML#ID1, after the well number for the passed parameters, need to be processed - //the first thing to get is the current href value in Let URL=Window.location.href.split ('#'); - console.log (URL);//print out is an array [' Http://localhost:63342/HTML_ExamplePractice/%E5%8D%9A%E5%AE%A2%E5%9B%AD%E6%8F%90%E5%89%8D%E7%BB %83%e4%b9%a0/index2.html ', ' id1 ') the second of the array is the data we passed to + - functionGohash (hash) { the if(Hash== 'ID1' ){ * Console.log ('Print out Id1');//ID1 will be printed at the same time . $ Panax Notoginseng }Else if(Hash== 'Id2' ){ - Console.log ('Print out Id2');//The ID2 is printed here the } + } A Gohash (url[1]); the } + </Script> - </HTML>
When you click on a tag in the Page1 page, it jumps to the Page2 page, and then gets the current href value so that we can get the data we want to pass, and use it later after processing. The knowledge points used are hash values and anchor points.
Use JS to upload data from one page to another by using URL parameters
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
