我有一个带有一些GET参数的URL,如下所示:
www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5
我需要得到c的全部值。我试图读取URL,但只得到m2。如何使用JavaScript执行此操作?
我有一个带有一些GET参数的URL,如下所示:
www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5
我需要得到c的全部值。我试图读取URL,但只得到m2。如何使用JavaScript执行此操作?
当前回答
我的解决方案:
/**
* get object with params from query of url
*/
const getParams = (url) => {
const params = {};
const parser = document.createElement('a');
parser.href = url;
const query = parser.search.substring(1);
if (query !== '') {
const vars = query.split('&');
for (let i = 0; i < vars.length; i++) {
const pair = vars[i].split('=');
const key = decodeURIComponent(pair[0]).replace('[]', '');
const value = decodeURIComponent(pair[1]);
if (key in params) {
if (Array.isArray(params[key])) {
params[key].push(value);
} else {
params[key] = [params[key]];
params[key].push(value);
}
} else params[key] = value;
}
}
return params;
}
其他回答
对于像index.html这样的单参数值?msg=1使用以下代码,
$(window).load(function(){
queryString();
});
function queryString()
{
var queryString = window.location.search.substring(1);
var varArray = queryString.split("="); //eg. index.html?msg=1
var param1 = varArray[0];
var param2 = varArray[1];
}
对于所有参数值,请使用以下代码:,
$(window).load(function(){
queryString();
});
function queryString()
{
var queryString = window.location.search;
var varArray = queryString.split("&");
for (var i=0;i<varArray.length;i++) {
var param = varArray[i].split("=");
//parameter-value pair
}
}
浏览器供应商已经通过URL和URLSearchParams实现了一种本地方式。
let url = new URL('http://www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5');
let searchParams = new URLSearchParams(url.search);
console.log(searchParams.get('c')); // outputs "m2-m3-m4-m5"
目前支持Firefox、Opera、Safari、Chrome和Edge。有关浏览器支持的列表,请参阅此处。
https://developer.mozilla.org/en-US/docs/Web/API/URLSearchParamshttps://developer.mozilla.org/en-US/docs/Web/API/URL/URL
https://url.spec.whatwg.org/
谷歌工程师埃里克·比德尔曼(Eric Bidelman)建议在不受支持的浏览器上使用这种polyfill。
最短路径:
new URL(location.href).searchParams.get("my_key");
Eldon McGuinness的Gist是迄今为止我见过的JavaScript查询字符串解析器的最完整的实现。
不幸的是,它是作为jQuery插件编写的。
我将其重写为vanilla JS,并做了一些改进:
函数parseQuery(str){var qso={};var qs=(str|| document.location.search);//检查是否有空的查询字符串如果(qs==“”){回归qso;}//规范化查询字符串qs=qs.replace(/(^\?)/,“”).replace(/;/g,“&”);而(qs.indexOf(“&&”)!=-1) {qs=qs.替换(/&&/g,'&');}qs=qs.replace(/([\&]+$)/,“”);//将查询字符串拆分为多个部分qs=qs.拆分(“&”);//生成querystring对象对于(变量i=0;i<qs.length;i++){var qi=qs[i].split(“=”);qi=qi.map(函数(n){返回decodeURIComponent(n)});if(类型qi[1]==“未定义”){qi[1]=空;}if(qso[qi[0]的类型!==“未定义”){//如果键已经存在,则将其设置为对象if(typeof(qso[qi[0])==“string”){var temp=qso[qi[0]];如果(qi[1]==“”){qi[1]=空;}qso[qi[0]]=[];qso[qi[0]].推(温度);qso[qi[0]。push(qi[1]);}否则如果(typeof(qso[qi[0])==“对象”){如果(qi[1]==“”){qi[1]=空;}qso[qi[0]。push(qi[1]);}}其他{//如果没有键,只需将其设置为字符串如果(qi[1]==“”){qi[1]=空;}qso[qi[0]]=qi[1];}}回归qso;}//演示console.log(parseQuery(“?foo=bar&foo=boo&roo=bar;bee=bop;=ghost;=ghost2;&;checkbox%5B%5D=b1;checkbox%5 B%5D=b2;dd=;http=http%3A%2F%2Fw3schools.com%2My%20test.asp%3Fname%3Dst%C3%A5le%26car%3Dsaab&http=http%2A%2F%3F%2Fw3schools2.com%2Fmy%20est.asp%3Fame%3Dst%A5%A5le%26car%3Dsaab”);
另请参见此Fiddle。
来源
function gup( name, url ) {
if (!url) url = location.href;
name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
var regexS = "[\\?&]"+name+"=([^&#]*)";
var regex = new RegExp( regexS );
var results = regex.exec( url );
return results == null ? null : results[1];
}
gup('q', 'hxxp://example.com/?q=abc')