JS解析url查询参数的简单代码


Posted in Javascript onAugust 06, 2017

废话不多说了,直接给大家贴代码了,具体代码如下所述:

var path = 'www.u.com/home?id=2&type=0&dtype=-1';
function parseUrl(url){
  var result = [];
  var query = url.split("?")[1];
  var queryArr = query.split("&");
  queryArr.forEach(function(item){
    var obj = {};
    var value = item.split("=")[0];
    var key = item.split("=")[1];
    obj[key] = value;
    result.push(obj);
  });
  return result;
}
console.log(parseUrl(path)); 
//[{id: '2'},{type: '0'},{dtype: '-1'}]

好了,下面看下js获取url参数值的两种方式

方法一:正则分析法

代码如下:

function getQueryString(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; 
}

调用方法:

alert(GetQueryString("参数名1"));alert(GetQueryString("参数名2")); 
alert(GetQueryString("参数名3"));

方法二

代码如下:

<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]]=unescape(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>

好了,到此结束。

Javascript 相关文章推荐
几个有趣的Javascript Hack
Jul 24 Javascript
JavaScript 创建运动框架的实现代码
May 08 Javascript
jquery表单验证框架提供的身份证验证方法(示例代码)
Dec 27 Javascript
30分钟快速掌握Bootstrap框架
May 24 Javascript
浅谈js的url解析函数封装
Jun 28 Javascript
JavaScript数据操作_浅谈原始值和引用值的操作本质
Aug 23 Javascript
最原始的jQuery注册验证方式
Oct 11 Javascript
vue2.0 与 bootstrap datetimepicker的结合使用实例
May 22 Javascript
详解小程序不同页面之间通讯的解决方案
Nov 23 Javascript
详解Angular Forms中自定义ngModel绑定值的方式
Dec 10 Javascript
Vue使用Proxy监听所有接口状态的方法实现
Jun 07 Javascript
部署vue+Springboot前后端分离项目的步骤实现
May 31 Javascript
使用bootstraptable插件实现表格记录的查询、分页、排序操作
Aug 06 #Javascript
JS中定位 position 的使用实例代码
Aug 06 #Javascript
Node.js 基础教程之全局对象
Aug 06 #Javascript
Node.js  REPL (交互式解释器)实例详解
Aug 06 #Javascript
Node.js  事件循环详解及实例
Aug 06 #Javascript
Angularjs上传图片实例详解
Aug 06 #Javascript
微信小程序 自定义消息提示框
Aug 06 #Javascript
You might like
PHP.MVC的模板标签系统(二)
2006/09/05 PHP
PHP实现删除非站内外部链接实例代码
2014/06/17 PHP
Redis构建分布式锁
2017/03/28 PHP
指定js可访问其它域名的cookie的方法
2007/09/18 Javascript
JS 参数传递的实际应用代码分析
2009/09/13 Javascript
js与jquery获取父元素,删除子元素的两种不同方法
2014/01/09 Javascript
深入理解javascript变量声明
2014/11/20 Javascript
详解JavaScript数组的操作大全
2015/10/19 Javascript
《JavaScript高级编程》学习笔记之object和array引用类型
2015/11/01 Javascript
jsonp跨域请求数据实现手机号码查询实例分析
2015/12/12 Javascript
7个去伪存真的JavaScript面试题
2016/01/07 Javascript
使用getBoundingClientRect方法实现简洁的sticky组件的方法
2016/03/22 Javascript
深入理解jQuery之防止冒泡事件
2016/05/24 Javascript
逻辑表达式中与或非的用法详解
2016/06/06 Javascript
bootstrap-table实现服务器分页的示例 (spring 后台)
2017/09/01 Javascript
js时间戳与日期格式之间相互转换
2017/12/11 Javascript
使用express获取微信小程序二维码小记
2019/05/21 Javascript
countup.js实现数字动态叠加效果
2019/10/17 Javascript
Vue.js 无限滚动列表性能优化方案
2019/12/02 Javascript
在Python中使用判断语句和循环的教程
2015/04/25 Python
python2.7实现FTP文件下载功能
2018/04/15 Python
python调用c++ ctype list传数组或者返回数组的方法
2019/02/13 Python
pandas和spark dataframe互相转换实例详解
2020/02/18 Python
python 图像增强算法实现详解
2021/01/24 Python
STRATHBERRY苏贝瑞包包官网:西班牙高级工匠手工打造
2020/11/10 全球购物
什么是类的返射机制
2016/02/06 面试题
开放系统互连参考模型
2016/06/29 面试题
用C#语言写出在本地创建一个UDP接收端口的具体过程
2016/02/22 面试题
新入职员工的自我介绍演讲稿
2014/01/02 职场文书
高中生期末评语大全
2014/01/28 职场文书
高一新生军训方案
2014/05/12 职场文书
森马旗舰店双十一营销方案
2014/09/29 职场文书
给老师的感谢信
2015/01/20 职场文书
公司回复函格式
2015/07/14 职场文书
Python爬虫进阶之Beautiful Soup库详解
2021/04/29 Python
matplotlib画混淆矩阵与正确率曲线的实例代码
2021/06/01 Python