JS获取URL中参数值(QueryString)的4种方法分享


Posted in Javascript onApril 12, 2014

方法一:正则法

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

方法二:split拆分法

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;
}
var Request = new Object();
Request = GetRequest();
// var 参数1,参数2,参数3,参数N;
// 参数1 = Request['参数1'];
// 参数2 = Request['参数2'];
// 参数3 = Request['参数3'];
// 参数N = Request['参数N'];

方法三:又见正则

通过JS获取url参数,这个经常用到。比如说一个url:http://w3water.com/?q=js,我们想得到参数q的值,那可以通过以下函数调用即可。

function GetQueryString(name) {  
    var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");  
    var r = window.location.search.substr(1).match(reg);  //获取url中"?"符后的字符串并正则匹配
    var context = "";  
    if (r != null)  
         context = r[2];  
    reg = null;  
    r = null;  
    return context == null || context == "" || context == "undefined" ? "" : context;  
}
alert(GetQueryString("q"));

方法四:单个参数的获取方法

function GetRequest() {
   var url = location.search; //获取url中"?"符后的字串
   if (url.indexOf("?") != -1) {    //判断是否有参数
      var str = url.substr(1); //从第一个字符开始 因为第0个是?号 获取所有除问号的所有符串
      strs = str.split("=");   //用等号进行分隔 (因为知道只有一个参数 所以直接用等号进分隔 如果有多个参数 要用&号分隔 再用等号进行分隔)
      alert(strs[1]);          //直接弹出第一个参数 (如果有多个参数 还要进行循环的)
   }
}

 

Javascript 相关文章推荐
js 判断 enter 事件
Feb 12 Javascript
Jquery ui css framework
Jun 28 Javascript
使用jspdf生成pdf报表
Jul 03 Javascript
如何动态加载外部Javascript文件
Dec 02 Javascript
jQuery链式调用与show知识浅析
May 11 Javascript
jQuery基于扩展简单实现倒计时功能的方法
May 14 Javascript
jQuery实现倒计时(倒计时年月日可自己输入)
Dec 02 Javascript
js canvas实现简单的图像扩散效果
Jun 28 Javascript
详解如何在angular2中获取节点
Nov 23 Javascript
Vue开发环境跨域访问问题
Jan 22 Javascript
vue a标签点击实现赋值方式
Sep 07 Javascript
Vue 401配合Vuex防止多次弹框的案例
Nov 11 Javascript
javascript对JSON数据排序的3个例子
Apr 12 #Javascript
Js保留小数点的4种效果实现代码分享
Apr 12 #Javascript
JS判断客户端是手机还是PC的2个代码
Apr 12 #Javascript
javascript window.open打开新窗口后无法再次打开该窗口问题的解决方法
Apr 12 #Javascript
jQuery中阻止冒泡事件的方法介绍
Apr 12 #Javascript
jquery ajax应用中iframe自适应高度问题解决方法
Apr 12 #Javascript
javascript事件冒泡详解和捕获、阻止方法
Apr 12 #Javascript
You might like
简单介绍下 PHP5 中引入的 MYSQLI的用途
2007/03/19 PHP
PHP将字符分解为多个字符串的方法
2014/11/22 PHP
php强制更新图片缓存的方法
2015/02/11 PHP
PHP网页缓存技术优点及代码实例
2020/07/29 PHP
区分JS中的undefined,null,&quot;&quot;,0和false
2007/03/08 Javascript
JQuery 学习笔记 选择器之三
2009/07/23 Javascript
Array.prototype.slice.apply的使用方法
2010/03/17 Javascript
javascript删除option选项的多种方法总结
2013/11/22 Javascript
javascript继承机制实例详解
2014/11/20 Javascript
基于jQuery 实现bootstrapValidator下的全局验证
2015/12/07 Javascript
Jquery使用小技巧汇总
2015/12/29 Javascript
JS中Json数据的处理和解析JSON数据的方法详解
2016/06/29 Javascript
原生JS取代一些JQuery方法的简单实现
2016/09/20 Javascript
gulp解决跨域的配置文件问题
2017/06/08 Javascript
微信小程序 蓝牙的实现实例代码
2017/06/27 Javascript
移动端效果之Swiper详解
2017/10/09 Javascript
web前端vue之CSS过渡效果示例
2018/01/10 Javascript
Vue微信项目按需授权登录策略实践思路详解
2018/05/07 Javascript
服务端预渲染之Nuxt(使用篇)
2019/04/08 Javascript
[37:29]完美世界DOTA2联赛PWL S2 LBZS vs Forest 第二场 11.19
2020/11/19 DOTA
使用Python脚本来获取Cisco设备信息的示例
2015/05/04 Python
Python的SQLalchemy模块连接与操作MySQL的基础示例
2016/07/11 Python
Python中Scrapy爬虫图片处理详解
2017/11/29 Python
在PYQT5中QscrollArea(滚动条)的使用方法
2019/06/14 Python
python2.7实现复制大量文件及文件夹资料
2019/08/31 Python
python实现UDP协议下的文件传输
2020/03/20 Python
Python3 pickle对象串行化代码实例解析
2020/03/23 Python
基于DOM+CSS3实现OrgChart组织结构图插件
2016/03/02 HTML / CSS
焊接专业毕业生求职信
2013/10/01 职场文书
护士自我介绍信
2014/01/13 职场文书
迅雷Cued工作心得体会
2014/01/27 职场文书
如何写早恋检讨书
2014/09/10 职场文书
正风肃纪剖析材料
2014/09/30 职场文书
环境卫生工作汇报材料
2014/10/28 职场文书
Python还能这么玩之用Python做个小游戏的外挂
2021/06/04 Python
使用pycharm运行flask应用程序的详细教程
2021/06/07 Python