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 相关文章推荐
循环 vs 递归浅谈
Feb 28 Javascript
在JavaScript中实现类的方式探讨
Aug 28 Javascript
基于jQuery1.9版本如何判断浏览器版本类型
Jan 12 Javascript
微信小程序 Template详解及简单实例
Jan 05 Javascript
JavaScript实现鼠标滚轮控制页面图片切换功能示例
Oct 14 Javascript
基于vue+canvas的excel-like组件实例详解
Nov 28 Javascript
详解创建自定义的Angular Schematics
Jun 06 Javascript
VUE预渲染及遇到的坑
Sep 03 Javascript
js replace替换字符串同时替换多个方法
Nov 27 Javascript
基于vue手写tree插件的那点事儿
Aug 20 Javascript
微信小程序搜索框样式并实现跳转到搜索页面(小程序搜索功能)
Mar 10 Javascript
利用vue3+ts实现管理后台(增删改查)
Oct 30 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生成和获取XML格式数据的方法
2016/03/04 PHP
PHP实时统计中文字数和区别
2019/02/28 PHP
Convert Seconds To Hours
2007/06/16 Javascript
jQuery select控制插件
2009/08/17 Javascript
JavaScript DOM 学习第三章 内容表格
2010/02/19 Javascript
javascript调试说明
2010/06/07 Javascript
javascript函数声明和函数表达式区别分析
2014/12/02 Javascript
深入理解JavaScript的React框架的原理
2015/07/02 Javascript
JavaScript多并发问题如何处理
2015/10/28 Javascript
BootStrap实现手机端轮播图左右滑动事件
2016/10/13 Javascript
JavaScript reduce和reduceRight详解
2016/10/24 Javascript
清除js缓存的多种方法总结
2016/12/09 Javascript
ES6新数据结构Map功能与用法示例
2017/03/31 Javascript
JS简单判断字符在另一个字符串中出现次数的2种常用方法
2017/04/20 Javascript
3分钟掌握常用的JS操作JSON方法总结
2017/04/25 Javascript
jQuery.form.js的使用详解
2017/06/14 jQuery
从零开始学习搭建React脚手架项目
2018/08/23 Javascript
element-ui表格数据转换的示例代码
2018/08/24 Javascript
Vuex的初探与实战小结
2018/11/26 Javascript
jQuery创建折叠式菜单
2019/06/15 jQuery
微信小程序页面间传递数组对象方法解析
2019/11/06 Javascript
JavaScript 中的无穷数(Infinity)详解
2020/02/13 Javascript
jquery向后台提交数组的代码分析
2020/02/20 jQuery
vue中后端做Excel导出功能返回数据流前端的处理操作
2020/09/08 Javascript
原生js实现购物车功能
2020/09/23 Javascript
Python解析nginx日志文件
2015/05/11 Python
python数据批量写入ScrolledText的优化方法
2018/10/11 Python
Python3获取电脑IP、主机名、Mac地址的方法示例
2019/04/11 Python
python如何使用jt400.jar包代码实例
2019/12/20 Python
Django后端分离 使用element-ui文件上传方式
2020/07/12 Python
windows系统Tensorflow2.x简单安装记录(图文)
2021/01/18 Python
需要知道的CSS3动画技术
2010/01/01 HTML / CSS
Expedia丹麦:全球领先的旅游网站
2018/03/18 全球购物
专科应届毕业生求职信
2014/06/04 职场文书
2014年客服工作总结与计划
2014/12/09 职场文书
HTML5中的DOCUMENT.VISIBILITYSTATE属性详解
2023/05/07 HTML / CSS