JS根据key值获取URL中的参数值及把URL的参数转换成json对象


Posted in Javascript onAugust 26, 2015

不废话了,直接贴代码了,通过示例一讲解JS根据key值获取URL中的参数值及把URL的参数转换成json对象,示例二讲解js获取url传递参数,具体内容请看下文

示例一:

//把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;
 }

示例二:

js通过两种方法获取url传递参数:

js获取url传递参数方法一:

 这里是一个获取URL带QUESTRING参数的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串中所带的同名参数

js获取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"));

其他参数获取介绍:

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

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);

以上内容介绍了JS根据key值获取URL中的参数值及把URL的参数转换成json对象,js通过两种方式获取url传递参数,代码

非常简单,希望对大家有所帮助。

Javascript 相关文章推荐
同时使用n个window onload加载实例介绍
Apr 25 Javascript
node.js适合游戏后台开发吗?
Sep 03 Javascript
jQuery中die()方法用法实例
Jan 19 Javascript
javascript实现仿IE顶部的可关闭警告条
May 05 Javascript
JS+CSS实现大气的黑色首页导航菜单效果代码
Sep 10 Javascript
javascript实现动态标签云
Oct 16 Javascript
js 判断一组日期是否是连续的简单实例
Jul 11 Javascript
简单谈谈原生js的math对象
Jun 27 Javascript
React学习笔记之高阶组件应用
Jun 02 Javascript
超出JavaScript安全整数限制的数字计算BigInt详解
Jun 24 Javascript
Jquery Datatables的使用详解
Jan 30 jQuery
vue组件系列之TagsInput详解
May 14 Javascript
jquery实现的横向二级导航效果代码
Aug 26 #Javascript
jQuery三级下拉列表导航菜单代码分享
Apr 15 #Javascript
jquery用ajax方式从后台获取json数据后如何将内容填充到下拉列表
Aug 26 #Javascript
js钢琴按钮波浪式图片排列效果代码分享
Aug 26 #Javascript
javascript中alert()与console.log()的区别
Aug 26 #Javascript
JavaScript基本数据类型及值类型和引用类型
Aug 25 #Javascript
基于jQuery实现的QQ表情插件
Aug 25 #Javascript
You might like
解析php DOMElement 操作xml 文档的实现代码
2013/05/10 PHP
IE中createElement需要注意的一个问题
2010/07/13 Javascript
简单实例处理url特殊符号&amp;处理(2种方法)
2013/04/02 Javascript
js事件冒泡实例分享(已测试)
2013/04/23 Javascript
兼容ie、firefox的图片自动缩放的css跟js代码分享
2013/08/12 Javascript
用jquery统计子菜单的条数示例代码
2013/10/18 Javascript
一个简单的jquery的多选下拉框(自写)
2014/05/05 Javascript
jQuery实现图片与文字描述左右滑动自动切换的方法
2015/07/27 Javascript
Angular 2父子组件数据传递之@ViewChild获取子组件详解
2017/07/04 Javascript
layui之select的option叠加问题的解决方法
2018/03/08 Javascript
vue.js中proxyTable 转发请求的实现方法
2018/09/20 Javascript
vue 指令之气泡提示效果的实现代码
2018/10/18 Javascript
p5.js临摹动态图形实现方法详解
2019/10/23 Javascript
[03:12]2016完美“圣”典风云人物:单车专访
2016/12/02 DOTA
Python设计模式之门面模式简单示例
2018/01/09 Python
python读取word文档,插入mysql数据库的示例代码
2018/11/07 Python
python保存二维数组到txt文件中的方法
2018/11/15 Python
pandas 数据索引与选取的实现方法
2019/06/21 Python
python 标准差计算的实现(std)
2019/07/29 Python
python文件绝对路径写法介绍(windows)
2019/12/25 Python
PyQt5实现登录页面
2020/05/30 Python
python-地图可视化组件folium的操作
2020/12/14 Python
在css3中background-clip属性与background-origin属性的用法介绍
2012/11/13 HTML / CSS
HTML5页面音视频在微信和app下自动播放的实现方法
2016/10/20 HTML / CSS
用canvas画心电图的示例代码
2018/09/10 HTML / CSS
WiFi云数码相框:Nixplay
2018/07/05 全球购物
在购买印度民族服饰:Soch
2020/09/15 全球购物
运动会广播稿50字
2014/01/26 职场文书
完美主义个人的自我评价
2014/02/17 职场文书
法律顾问服务方案
2014/05/15 职场文书
教师竞聘演讲稿
2014/05/16 职场文书
三严三实对照检查材料
2014/08/25 职场文书
银行奉献演讲稿
2014/09/16 职场文书
2019年图书室自查报告范本
2019/10/12 职场文书
《雪域豹影》读后感:父爱的伟大
2019/12/23 职场文书
MySQL详细讲解变量variables的用法
2022/06/21 MySQL