js-获取url参数值

  • 时间:2018-06-06 01:46 作者:web翎云阁 来源:web翎云阁 阅读:334
  • 扫一扫,手机访问
摘要:今天碰到要在一个页面获取另外一个页面url传过来的参数,一开始很本可以的想到了使用 split(“?”)这样一步步的分解出需要的参数。喜欢的朋友能测试下,希望对大家有所帮助!js方法一:正则分析法,指定参数名获取值。function getQueryString(name){var reg =new

今天碰到要在一个页面获取另外一个页面url传过来的参数,一开始很本可以的想到了使用 split(“?”)这样一步步的分解出需要的参数。

喜欢的朋友能测试下,希望对大家有所帮助!


js方法一:正则分析法,指定参数名获取值。

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;

}

// 这样调使用:

// http://orzhtml.github.io?a=1&b=2&c=3

console.log(getQueryString("a"));

console.log(getQueryString("b"));

console.log(getQueryString("c"));

结果截图:

js-获取url参数值

下面举一个例子:

若地址栏URL为:abc.html?id=123&url=http://orzhtml.github.io

那么,但你使用上面的方法去调使用:alert(getQueryString("url"));

则会弹出一个对话框:内容就是 http://orzhtml.github.io

假如使用:alert(getQueryString("id"));那么弹出的内容就是 123 啦;

当然假如你没有传参数的话,比方你的地址是 abc.html 后面没有参数,那强行输出调使用结果有的时候会报错:

所以我们要加一个判断 ,判断我们请求的参数能否为空,首先把值赋给一个变量:

var myurl= getQueryString("url");

if(myurl != null && myurl.toString().length>1) {

alert(myurl);

}


js方法二:获取所有参数这样就不会报错了,结果返回始终会是一个对象!

function GetRequest(){

var url = location.search;//获取url中"?"符后的字串

var theRequest ={};

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;

}

// 这样调使用

// http://orzhtml.github.io?a=4&amp;b=5&amp;c=6

var Request = {};

Request = GetRequest();

console.log(Request);

console.log(Request['a']);

console.log(Request['b']);

console.log(Request['c']);

结果截图:

js-获取url参数值


本文内容均属个人原创作品,转载此文章须附上出处及原文链接。

加关注,定时推送,互动精彩多,若你有更好的见地,欢迎留言讨论!

  • 全部评论(0)
上一篇:js递归生成树结构
下一篇:JS中的callback
最新发布的资讯信息
【系统环境|】极客时间-数据分析实战45讲【完结】(2021-09-02 16:26)
【系统环境|windows】字节跳动前台面试题解析:盛最多水的容器(2021-03-20 21:27)
【系统环境|windows】DevOps敏捷60问,肯定有你想理解的问题(2021-03-20 21:27)
【系统环境|windows】字节跳动最爱考的前台面试题:JavaScript 基础(2021-03-20 21:27)
【系统环境|windows】JavaScript 的 switch 条件语句(2021-03-20 21:27)
【系统环境|windows】解决 XML 数据应用实践(2021-03-20 21:26)
【系统环境|windows】20个编写现代CSS代码的建议(2021-03-20 21:26)
【系统环境|windows】《vue 3.0探险记》- 运行报错:Error:To install them, you can run: npm install --save core-js/modules/es.arra...(2021-03-20 21:24)
【系统环境|windows】浅谈前台可视化编辑器的实现(2021-03-20 21:24)
【系统环境|windows】产品经理入门迁移学习指南(2021-03-20 21:23)
血鸟云
手机二维码手机访问领取大礼包
返回顶部