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 相关文章推荐
在b/s开发中经常用到的javaScript技术
Aug 23 Javascript
js中top/parent/frame概述及案例应用
Feb 06 Javascript
HTML长文本截取含有HTML代码同样适用的两种方法
Jul 31 Javascript
常规表格多表头查询示例
Feb 21 Javascript
Javascript 赋值机制详解
Nov 23 Javascript
JavaScript使用二分查找算法在数组中查找数据的方法
Apr 07 Javascript
JS+CSS实现类似QQ好友及黑名单效果的树型菜单
Sep 22 Javascript
javascript特殊日历控件分享
Mar 07 Javascript
vue服务端渲染的实例代码
Aug 28 Javascript
React Native验证码倒计时工具类分享
Oct 24 Javascript
JavaScript中的ES6 Proxy的具体使用
Jun 16 Javascript
快速对接payjq的个人微信支付接口过程解析
Aug 15 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生成带有雪花背景的验证码
2006/10/09 PHP
PHP仿盗链代码
2012/06/03 PHP
PHP实现搜索相似图片
2015/09/22 PHP
微信随机生成红包金额算法php版
2016/07/21 PHP
不错的新闻标题颜色效果
2006/12/10 Javascript
脚本之家贴图转换+转贴工具用到的js代码超级推荐
2007/04/05 Javascript
用js判断页面刷新或关闭的方法(onbeforeunload与onunload事件)
2012/06/22 Javascript
变量声明时命名与变量作为对象属性时命名的区别解析
2013/12/06 Javascript
jquery实现的美女拼图游戏实例
2015/05/04 Javascript
使用RequireJS优化JavaScript引用代码的方法
2015/07/01 Javascript
React + webpack 环境配置的方法步骤
2017/09/07 Javascript
微信小程序实现搜索历史功能
2020/03/26 Javascript
利用PHP实现递归删除链表元素的方法示例
2020/10/23 Javascript
深入讲解Python中的迭代器和生成器
2015/10/26 Python
浅谈python字典多键值及重复键值的使用
2016/11/04 Python
Python进阶_关于命名空间与作用域(详解)
2017/05/29 Python
python对离散变量的one-hot编码方法
2018/07/11 Python
python pandas模块基础学习详解
2019/07/03 Python
PyQt 图解Qt Designer工具的使用方法
2019/08/06 Python
keras 回调函数Callbacks 断点ModelCheckpoint教程
2020/06/18 Python
HTML中meta标签及Keywords
2020/04/15 HTML / CSS
Abe’s of Maine:自1979以来销售相机和电子产品
2016/11/21 全球购物
奥兰多迪士尼门票折扣:Undercover Tourist
2018/07/09 全球购物
英国领先的电视购物零售商:Ideal World
2019/03/18 全球购物
Oracle快照(snapshot)
2015/03/13 面试题
小班开学寄语
2014/04/04 职场文书
竞选卫生委员演讲稿
2014/04/28 职场文书
2014教师教育实践活动对照检查材料思想汇报
2014/09/21 职场文书
教师政风行风自查自纠报告
2014/10/21 职场文书
财务整改报告范文
2014/11/05 职场文书
2015年秋季新学期寄语
2015/03/25 职场文书
投诉信范文
2015/07/02 职场文书
大学升旗仪式主持词
2015/07/04 职场文书
Pytorch distributed 多卡并行载入模型操作
2021/06/05 Python
python元组打包和解包过程详解
2021/08/02 Python
Python爬虫入门案例之回车桌面壁纸网美女图片采集
2021/10/16 Python