JS获取URL参数值及转JSON对象的方法与代码示例

以下通过两个示例，分别讲解如何利用JavaScript根据Key值获取URL中的参数值，以及如何将URL中的参数转换为JSON对象。

示例一：参数转JSON与Key获取

示例一：

//将URL中的参数字符串解析并转换为JSON对象


 parseQueryString: function (url) {
  var reg_url = /^[^\?]+\?([\w\W]+)$/,
   reg_para = /([^&=]+)=([\w\W]*?)(&|$|#)/g,
   arr_url = reg_url.exec(url),
   ret = {};
  if (arr_url && arr_url[1]) {
   var str_para = arr_url[1], result;
   while ((result = reg_para.exec(str_para)) != null) {
    ret[result[1]] = result[2];
   }
  }
  return ret;
 }

//根据指定的Key值从URL中提取对应的参数值


 getQueryString: function (name) {
  var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
  var r = window.location.search.substr(1).match(reg);
  if (r != null) return unescape(r[2]);
  return null;
 }

示例二：获取URL参数的两种方法

示例二：

JavaScript获取URL传递参数的两种实现方式如下：

方法一：获取URL传递参数

这是一个用于获取URL中Query String参数的JavaScript客户端解决方案，其功能类似于ASP中的request.querystring或PHP中的$_GET数组。具体函数定义如下：


<Script language="javascript">
function GetRequest() {
 
 var url = location.search; //获取url中"?"符后的字串
 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]]=(strs[i].split("=")[1]);
  }
 }
 return theRequest;
}
</Script>

调用上述函数即可获取对应的参数值：


<Script language="javascript">
var Request = new Object();
Request = GetRequest();
var 参数1,参数2,参数3,参数N;
参数1 = Request[''参数1''];
参数2 = Request[''参数2''];
参数3 = Request[''参数3''];
参数N = Request[''参数N''];
</Script>

通过上述方式，可以获取URL字符串中携带的同名参数。

方法二：使用正则分析法获取URL传递参数


function GetQueryString(name) {
  var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)","i");
  var r = window.location.search.substr(1).match(reg);
  if (r!=null) return (r[2]); return null;
}
alert(GetQueryString("参数名1"));
alert(GetQueryString("参数名2"));
alert(GetQueryString("参数名3"));

location对象属性详解

其他相关参数获取方式介绍：

//用于设置或获取对象指定的文件名或路径。


alert(window.location.pathname);

//用于设置或获取完整的URL字符串。


alert(window.location.href);

//用于设置或获取与URL关联的端口号码。


alert(window.location.port);

//用于获取URL的协议部分。


alert(window.location.protocol);

//用于获取href属性中井号“#”后面的分段（哈希值）。


alert(window.location.hash);

//用于获取location或URL的hostname和port号码。


alert(window.location.host);

//用于获取href属性中问号后面的部分（查询字符串）。


alert(window.location.search);

以上内容介绍了JavaScript根据Key值获取URL参数值及将URL参数转换为JSON对象的方法，并展示了两种获取URL传递参数的代码实现。

代码实现非常简单，希望对开发者有所帮助。

JavaScript解析URL参数的两种方法及属性详解

示例一：参数转JSON与Key获取

示例二：获取URL参数的两种方法

location对象属性详解

实用工具推荐