URL地址(添加参数:传参)

js写法:
  1. //1.window.location.href
  2. var a ="1018802,8"
  3. var b ="1"
  4. window.location.href="../EditPosts.aspx?postid="+a+"&update="+b;
  5. //2.字符串模板,动态生成href属性
  6. var c = '<a class=" " href="../EditPosts.aspx?postid=\''+a+'\')">查看地址</a>'

URL地址(获取参数:取参)

1.只使用split将字符串截取成数组
  1. var url=window.location.href
  2. var pars=url.split("?")[1].split("=")[1].split(",")[1];
  3. //例如 https://i.cnblogs.com/EditPosts.aspx?postid=1018802,8&update=1
  4. //执行到split("?")[1] => "postid=1018802,8&update=1"
  5. //执行到split("&")[1] => "1018802,8&update"
  6. //执行到split(",") => ["1018802,8","update"]
  7. //执行到split(",")[1] => "1018802,8"

反复截取,有点繁琐哎~

2.字符串拆分法

window.location.href 或者 location.href 或者 window.location 获得地址栏中的所有内容

decodeURI()可以解码地址栏中的数据 恢复中文数据

window.search 获得地址栏中问号及问号之后的数据

  1. //获取地址栏里(URL)传递的参数
  2. function GetRequest(value) {
  3. //url例子:www.bicycle.com?id="123456"&Name="bicycle";
  4. var url = decodeURI(location.search); //?id="123456"&Name="bicycle";
  5. var object = {};
  6. if(url.indexOf("?") != -1)//url中存在问号,也就说有参数。
  7. {
  8. var str = url.substr(1); //得到?后面的字符串
  9. var strs = str.split("&"); //将得到的参数分隔成数组[id="123456",Name="bicycle"];
  10. for(var i = 0; i < strs.length; i ++)
  11. {
  12.         object[strs[i].split("=")[0]]=strs[i].split("=")[1]
  13.       }
  14.   }
  15. return object[value];
  16. }
3.正则匹配法

这种方法其实原理和上一种方法类似,都是从URL中提取,只是提取的方法不同而已。

  1. function GetQueryString(name) {
  2. var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
  3. var r = window.location.search.substr(1).match(reg);
  4. if (r != null) {
  5. return unescape(r[2]);
  6. }
  7. return null;
  8. }
4.在vue中可以通过this.$route获取路由对象然后根据具体需要取对象内容
  1. this.$route.path 当前页面路由
  2. this.$route.params 路由参数
  3. this.$route.query 查询路由参数

获取和添加URL地址栏参数的更多相关文章

  1. js获取url地址栏参数

    前端开发中经常会遇到需要获取url地址栏参数问题 方法如下: function getQueryStringByName(name){ var src = "www.baidu.com?na ...

  2. JavaScript获得URL地址栏参数防乱码

    JavaScript获得URL地址栏参数防乱码 JavaScript中经常需要解析地址栏中拼接的参数.下面的代码基本是固定的代码,这里摘录下备用. //获得地址栏参数值 function getUrl ...

  3. Vue下URL地址栏参数改变却不能刷新界面

    在完成毕业设计(基于Vue的信息资讯展示与管理平台)的过程中,处理如下图所示的 点击左侧栏目列表跳转到对应文章列表 的问题时,初次点击可以跳转到对应的页面,但是当第二次点击时,虽然地址栏的参数改变了, ...

  4. Js获取当前页面URL各种参数

    JS获取当前页面URL各种参数 一:Location Location 对象包含有关当前 URL 的信息. Location 对象是 Window 对象的一个部分,可通过 window.locatio ...

  5. javascript/jquery获取url地址栏参数的方法

    简洁jq方法获取url地址栏的参数 function getQueryVariable(variable){ var query = window.location.search.substring( ...

  6. PHP获取当前页面的URL作为参数以供下一层的页面可以返回上一层页面

    1.基础url的获取 #测试网址: http://localhost/blog/testurl.php?id=5 //获取域名或主机地址 echo $_SERVER['HTTP_HOST'].&quo ...

  7. js获取、修改url中参数

    //获取url的参数 function getParam(paramKey){ //获取当前URL var url = location.href; //获取要取得的get参数位置 var get = ...

  8. url地址栏参数<==>对象(将对象转换成地址栏的参数以及将地址栏的参数转换为对象)的实用函数

    /** * @author web得胜 * @param {Object} obj 需要拼接的参数对象 * @return {String} * */ function obj2qs(obj) { i ...

  9. js获取url地址栏参数的方法,解决中文乱码问题,能支持中文参数

    第一种:参数只能是英文的 function getQuery(name) { var reg = new RegExp("(^|&)" + name + "=([ ...

随机推荐

  1. CentOS7安装MYSQL。

    参考这个文章(网页已存到本地):http://www.cnblogs.com/starof/p/4680083.html 安装完成后,本地登录MYSQL没有问题. 现在主要是在windows下用ora ...

  2. 文件分享系统(Django)

  3. CentOS-6.6安装配置Tomcat-7

    安装说明 安装环境:CentOS-6.3安装方式:源码安装 软件:apache-tomcat-7.0.29.tar.gz下载地址:http://tomcat.apache.org/download-7 ...

  4. Feign status 400 reading 问题分析

    背景:项目使用的是微服务架构,采用springboot来开发,所有的服务都是基于内嵌tomcat来运行 问题:项目部署到测试环境之后,偶尔在后台日志会看到这样的日志:Feign status 400 ...

  5. C# 算法系列一基本数据结构

    一.简介 作为一个程序员,算法是一个永远都绕不过去的话题,虽然在大学里参加过ACM的比赛,没记错的话,浙江赛区倒数第二,后来不知怎么的,就不在Care他了,但是现在后悔了,非常的后悔!!!如果当时好好 ...

  6. 公共技术点(Android 动画基础)

    转载地址:http://p.codekk.com/blogs/detail/559623d8d6459ae793499787 一 传统 View 动画(Tween/Frame) 1.1 Tween 动 ...

  7. VMware虚拟机克隆Linux(CentOS)系统后找不到eth0网卡的问题(图文详解)

     问题现象: 有时候,会使用VMware虚拟机的的克隆功能,快速的复制已安装好的Linux系统. 可是克隆完之后,会发现没有eth0网卡. 解决办法: 1.编辑/etc/udev/rules.d/70 ...

  8. 详解C#特性和反射(三)

    类型信息(Type Information)用来表示类型声明的信息,通过抽象基类System.Type的实例存储这些信息,当使用反射时,CLR获取指定类型的Type对象,通过这个对象即可访问该类型的任 ...

  9. java CAS算法

    CAS算法是硬件对于并发操作的支持,其中包含了三个操作数:内存值,预估值和更新值.没当要执行更新操作时,会先在同步方法中比较内存值和预估值是否相等,如果相等才会用更新值替换内存值,否则什么也不做. p ...

  10. Java 8 新特性-菜鸟教程 (0) -Java 8 新特性

    Java 8 新特性 Java 8 (又称为 jdk 1.8) 是 Java 语言开发的一个主要版本. Oracle 公司于 2014 年 3 月 18 日发布 Java 8 ,它支持函数式编程,新的 ...