第一种 通过正则获取URL中指定的参数

/**
* 获取指定的URL参数值
* URL:http://www.xxx.com/index?name=123
* 参数:param URL参数
* 调用方法:getParam("name")
* 返回值:123
* alert(getParam('date'));
*/
function getParam(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
  //search,查询?后面的参数,并匹配正则
var r = location.search.substr(1).match(reg);
  if (r != null) return decodeURI(decodeURI(r[2]));
}

第二种 既可以获取URL中全部参数,也可以获取单个参数

/**
* js获取url参数值
* 思路,通过location的search获取url中问号后面的值,字符串过滤掉问号,再通过split方法分割参数集合、循环赋值、匹配对应的参数,最后返回值
* URL:http://www.xxx.com/index?name=123
* 参数:param URL参数
* 调用方法:getUrlParams("name")
* 返回值:123
* alert(getUrlParams('date'));
*/
function getUrlParams(name) { // 不传name返回所有值,否则返回对应值
var url = window.location.search;
if (url.indexOf('?') == 1) { return false; }
url = url.substr(1);
url = url.split('&');
var name = name || '';
var nameres;
// 获取全部参数及其值
for(var i=0;i<url.length;i++) {
var info = url[i].split('=');
var obj = {};
obj[info[0]] = decodeURI(info[1]);
url[i] = obj;
}
// 如果传入一个参数名称,就匹配其值
if (name) {
for(var i=0;i<url.length;i++) {
for (const key in url[i]) {
if (key == name) {
nameres = url[i][key];
}
}
}
} else {
nameres = url;
}
// 返回结果
return nameres;
}
const url = 'http://www.abc.com/test.php?id=1&from=index';
var res = getUrlParams();
var res1 = getUrlParams('id');
console.log(res); // [{id: "1"}, {from: "index"}]
console.log(res1); //

第三种 获取URL中的参数名及参数值的集合

/**
* [获取URL中的参数名及参数值的集合]
* 示例URL:http://htmlJsTest/getrequest.html?uid=admin&rid=1&fid=2&name=小明
* @param {[string]} urlStr [当该参数不为空的时候,则解析该url中的参数集合]
* @return {[string]} [参数集合]
*/
function GetRequest(urlStr) {
if (typeof urlStr == "undefined") {
var url = decodeURI(location.search); //获取url中"?"符后的字符串
} else {
var url = "?" + urlStr.split("?")[1];
}
var theRequest = new Object();
if (url.indexOf("?") != -1) {
var str = url.substr(1);
strs = str.split("&");
for (var i = 0; i < strs.length; i++) {
theRequest[strs[i].split("=")[0]] = decodeURI(strs[i].split("=")[1]);
}
}
return theRequest;
}
 var parms_1 = GetRequest();
2 console.log(parms_1); // {"uid":"admin","rid":"1","fid":"2","name":"小明"}
3 console.log(parms_1['name']); // '小明'
4 var parms_2 = GetRequest('http://htmlJsTest/getrequest.html?uid=admin&rid=1&fid=2&name=小明');
5 console.log(parms_2); // {"uid":"admin","rid":"1","fid":"2","name":"小明"}
6 console.log(parms_2['name']); // '小明'

第四种 通过参数名获取url中的参数值

/**
* [通过参数名获取url中的参数值]
* 示例URL:http://htmlJsTest/getrequest.html?uid=admin&rid=1&fid=2&name=小明
* @param {[string]} queryName [参数名]
* @return {[string]} [参数值]
*/
function GetQueryValue(queryName) {
var query = decodeURI(window.location.search.substring(1));
var vars = query.split("&");
for (var i = 0; i < vars.length; i++) {
var pair = vars[i].split("=");
if (pair[0] == queryName) { return pair[1]; }
}
return null;
}
1 var queryVal=GetQueryValue('name');
2 console.log(queryVal);// 小明

js获取URL里的参数的更多相关文章

  1. js 获取url中的参数 修改url 参数 移除url参数

    js 获取url中的参数 修改url 参数 移除url参数 var jsUrlHelper = { getUrlParam : function(url, ref) { var str = " ...

  2. js获取url中的参数,并保证获取到的参数不乱码

    //网上比较经典的js获取url中的参数的方法 function getQueryString(name) { var reg = new RegExp("(^|&)" + ...

  3. js获取URL中的参数

    js获取URL中的一些参数的意思 location对象 含有当前URL的信息. 属性 href 整个URL字符串. protocol 含有URL第一部分的字符串,如http: host 包含有URL中 ...

  4. APPCAN开发笔记:html页面之间的参数传递:使用js获取url中的参数,以及在APPCAN中不能使用的解决方法

    用PHP的GET/POST方式来传递方式已经是司空见惯了,但是如果我的页面是一个静态的html的页面,想传递参数的时候要怎么办呢?在APPCAN的开发中我们会经常遇到这样的问题,因为所有的页面都是静态 ...

  5. js获取url传递得参数

    方法一:正则法 function getQueryString(name) { var reg = new RegExp('(^|&)' + name + '=([^&]*)(& ...

  6. js获取url地址的参数的方法

    js获取url参数值 今天说一下如何获取url参数值. 思路 通过location的search就可以获取到url中问号后面的值. 字符串过滤到问号 通过split方法分割参数集合 循环赋值 匹配对应 ...

  7. js获取url中的参数对象、js生成带参数的url

    // 获取url中的参数,并返回一个对象 $.getRequestData = function() { var url = location.search; //获取url中"?" ...

  8. 使用js获取url里的指定参数

    String.prototype.getQuery = function(name){     var reg = new RegExp("(^|&)"+ name +&q ...

  9. js获取url中的参数,url中传递中文的时候通过js解码的方式

    如果传递的参数是: <a href="${pageContext.request.contextPath}/productdisplay/productDisplay_productD ...

随机推荐

  1. OpenLayers要素拖拽

    //拖拽要素 function dragFeature (_map,_dragEndCallback) { let selFeature = null; _map.on("pointerdr ...

  2. Android布局管理器-从实例入手学习相对布局管理器的使用

    场景 AndroidStudio跑起来第一个App时新手遇到的那些坑: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/103797 ...

  3. 常量, char[], const char[], char*, const char*, char* const以及const char* const的详解

    注意,这里用char类型只是举了一个例子,其他的int之类的也通用. 1: 常量: 例子: char str[] = "Hello world!"; char ch = 'a'; ...

  4. MySql优化之mycat

    1. 解压mycat,不要放在有中文目录的地方  下载地址:http://dl.mycat.io/1.6-RELEASE/2 .修改mycat解压目录下的conf文件夹中server.xml文件,配置 ...

  5. 选择排序 C++实现

    实现思想: 1.寻找[i, n)区间里的最小值min ( i>= 0 ) 2.交换min和第i的数 ( i>= 0 ) #include <iostream> #include ...

  6. ArcGIS Runtime SDK for Android中SimpleFillSymbol.Style样式

    SimpleFillSymbol.Style样式枚举共8种: 1.BACKWARD_DIAGONAL 反对角线填充 2.CROSS 交叉线填充 3.DIAGONAL_CROSS 前后对角线填充 4.F ...

  7. stream重复Key的处理

    Map<String, List<Model>> modelMap = modelList .stream() .collect(Collectors .toMap(model ...

  8. Docker 下部署hadoop集群

    一.主机规划 3台主机:1个master.2个slaver/worker ip地址使用docker默认的分配地址: master: 主机名: hadoop2.ip地址: 172.17.0.2 slav ...

  9. Web_0005:阿里云服务器OSS权限的配置开通

    创建用户 1,创建子用户 2,点击新建用户 3,设置账号类型,可以同时选 设置权限 1,设置对阿里云模块的控制权限,如 oss  ecs 等的访问控制权限 2,点击所需的权限 3,获取账号的Acess ...

  10. 一维数组、二维数组——Java

    一. 一维数组 1.  数组是相同类型数据的有序集合 相同类型的若干个数据,按照一定先后次序排列组合而成 每个数组元素可以通过一个下标来访问它们 其中,每一个数据称作一个数组元素 2. 数组特点: 其 ...