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 相关文章推荐
input 高级限制级用法
Mar 26 Javascript
javascript 模拟点击广告
Jan 02 Javascript
extjs grid设置某列背景颜色和字体颜色的方法
Sep 03 Javascript
浅谈JavaScript之事件绑定
Jul 08 Javascript
IE、FF、Chrome浏览器中的JS差异介绍
Aug 13 Javascript
jQuery经过一段时间自动隐藏指定元素的方法
Mar 17 Javascript
js判断图片加载完成后获取图片实际宽高的方法
Feb 25 Javascript
JavaScript中闭包的写法和作用详解
Jun 29 Javascript
Angular外部使用js调用Angular控制器中的函数方法或变量用法示例
Aug 05 Javascript
jQuery Ajax Post 回调函数不执行问题的解决方法
Aug 15 Javascript
基于easyui checkbox 的一些操作处理方法
Jul 10 Javascript
vue计算属性+vue中class与style绑定(推荐)
Mar 30 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
PHP+Mysql+Ajax+JS实现省市区三级联动
2014/05/23 PHP
Yii2汉字转拼音类的实例代码
2017/04/18 PHP
基于Jquery的$.cookie()实现跨越页面tabs导航实现代码
2011/03/03 Javascript
js内置对象 学习笔记
2011/08/01 Javascript
jquery显示和隐藏div特效实例
2013/02/27 Javascript
js实现上传图片之上传前预览图片
2013/03/25 Javascript
给Flash加一个超链接(推荐使用透明层)兼容主流浏览器
2013/06/09 Javascript
Js点击弹出下拉菜单效果实例
2013/08/12 Javascript
JQuery右键菜单插件ContextMenu使用指南
2014/12/19 Javascript
JS实现5秒钟自动封锁div层的方法
2015/02/20 Javascript
JavaScript数组随机排列实现随机洗牌功能
2015/03/19 Javascript
JavaScript实现图片DIV竖向滑动的方法
2015/04/25 Javascript
js删除Array数组中指定元素的两种方法
2016/08/03 Javascript
JS动态计算移动端rem的解决方案
2016/10/14 Javascript
Angularjs中使用指令绑定点击事件的方法
2017/03/30 Javascript
Linux CentOS系统下安装node.js与express的方法
2017/04/01 Javascript
VueJS事件处理器v-on的使用方法
2017/09/27 Javascript
使用JavaScript实现node.js中的path.join方法
2018/08/12 Javascript
纯异步nodejs文件夹(目录)复制功能
2019/09/03 NodeJs
CountUp.js数字滚动插件使用方法详解
2019/10/17 Javascript
Vue.js 实现地址管理页面思路详解(地址添加、编辑、删除和设置默认地址)
2019/12/11 Javascript
Vue axios 跨域请求无法带上cookie的解决
2020/09/08 Javascript
[51:44]2018DOTA2亚洲邀请赛 4.3 突围赛 Optic vs iG 第二场
2018/04/04 DOTA
[49:29]LGD vs Winstrike 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/18 DOTA
Django中使用第三方登录的示例代码
2018/08/20 Python
对python numpy.array插入一行或一列的方法详解
2019/01/29 Python
处理Selenium3+python3定位鼠标悬停才显示的元素
2019/07/31 Python
Django 后台获取文件列表 InMemoryUploadedFile的例子
2019/08/07 Python
python 实现aes256加密
2020/11/27 Python
欧洲最古老的鞋厂:Peter Kaiser
2019/11/05 全球购物
汽车检测与维修应届毕业生求职信
2013/10/19 职场文书
学习十八届三中全会精神实施方案
2014/02/17 职场文书
代领报检证委托书范本
2014/10/11 职场文书
离职告别感言
2015/08/04 职场文书
Python 的演示平台支持 WSGI 接口的应用
2022/04/20 Python
Golang map映射的用法
2022/04/22 Golang