利用URL地址实现页面间传输数据和获取数据

提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档

文章目录

• 前言
• 一、pandas是什么？
• 二、使用步骤
  • 1.引入库
  • 2.读入数据
• 总结

---

前言

        我们常常看到网址后面会有一个问号，后面会带一大堆类似key-value结构的数据。其实这是向另一个网址传值的其中一个方式。下面利用URL地址实现页面间传输数据和获取数据的方法

---

一、通过URL向另一个页面传递数据

        我们两种方法进行传值：

        1 a标签中设置href在url上存放数据，里面的数据以key-value方式存储

         2 通过window.location.href="url"

       

    注意这里我用到的vue框架，需要在href前加:
1 <a :href="'movieIntro.html?id='+id+''"></a>
整体上双引号中要让一组单引号这样才能使添加的动态数据成功传递    href="'url'"

我们要添加动态数据时数据只需要在添加的变量两边加上单引号和加号  '+变量+'
这起始也是跟拼接字符串类似


2 window.location.href="movieIntro.html?id="+this.id;
    这种就是拼接字符串的方法，可以很简单的设置url并跳转，但需要方法来调用它

下面我们举个栗子

        例如这是我制作的电影如果要点击电影的图片就会进入电影详情页

      

 

        进入详情页后我们可以看到上面网页上？后有个id=3，这就是我们要传递的数据，我们可以出来的数据来显示对应的内容。那么我们怎么接收url上的数据呢？

http://localhost:63342/boottest/static/pages/movieIntro.html?id=3

电影介绍

 

二、接收URL上的数据

   我们可以通过location.search方法

location.search可以获取 包含?和?后的字符串  如？id=3
var url=location.search;

我们可以通过去字符串处理来获得我们想要的数据    
this.movieId=url.split('=')[1];          以等号分割字符串[0]id [1]3             

---

总结

希望以上的方法能够帮助你们，csdn帮助我解决了很多问题，非常感谢无私奉献的彭友们~