我有一个带有一些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执行此操作?
当前回答
优雅、实用的解决方案
让我们创建一个包含URL参数名作为关键字的对象,然后我们可以通过其名称轻松提取参数:
// URL: https://example.com/?test=true&orderId=9381
// Build an object containing key-value pairs
export const queryStringParams = window.location.search
.split('?')[1]
.split('&')
.map(keyValue => keyValue.split('='))
.reduce<QueryStringParams>((params, [key, value]) => {
params[key] = value;
return params;
}, {});
type QueryStringParams = {
[key: string]: string;
};
// Return URL parameter called "orderId"
return queryStringParams.orderId;
其他回答
您可以添加一个输入框,然后要求用户将值复制到其中……这非常简单:
<h1>Hey User! Can you please copy the value out of the location bar where it says like, &m=2? Thanks! And then, if you could...paste it in the box below and click the Done button?</h1>
<input type='text' id='the-url-value' />
<input type='button' value='This is the Done button. Click here after you do all that other stuff I wrote.' />
<script>
//...read the value on click
好吧,但说真的。。。我发现了这段代码,它似乎很有用:
http://www.developerdrive.com/2013/08/turning-the-querystring-into-a-json-object-using-javascript/
function queryToJSON() {
var pairs = location.search.slice(1).split('&');
var result = {};
pairs.forEach(function(pair) {
pair = pair.split('=');
result[pair[0]] = decodeURIComponent(pair[1] || '');
});
return JSON.parse(JSON.stringify(result));
}
var query = queryToJSON();
对于像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
}
}
使用URLSearchParams的超简单方法。
function getParam(param){
return new URLSearchParams(window.location.search).get(param);
}
目前,Chrome、Firefox、Safari、Edge和其他浏览器都支持它。
function parseUrl(url){
let urlParam = url.split("?")[1];
console.log("---------> URL param : " + urlParam);
urlParam = urlParam.split("&");
let urlParamObject = {};
for(let i=0;i < urlParam.length;i++){
let tmp = urlParam[i].split("=");
urlParamObject[tmp[0]] = tmp[1];
}
return urlParamObject;
}
let param = parseUrl(url);
param.a // output 10
param.b // output 20
我的解决方案:
/**
* 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;
}