如果我有一个 URL，例如
http://localhost/search.php?year=2008
我将如何编写一个 JavaScript 函数来获取变量year并查看它是否包含任何内容？
我知道它可以完成，location.search但我无法弄清楚它是如何获取参数的。
如何从 location.search 获取特定参数？
IT技术
javascript
url
2021-01-26 15:25:06
6个回答
我最喜欢的获取 URL 参数的方法是这种方法：
var parseQueryString = function() {
var str = window.location.search;
var objURL = {};
str.replace(
new RegExp( "([^?=&]+)(=([^&]*))?", "g" ),
function( $0, $1, $2, $3 ){
objURL[ $1 ] = $3;
}
);
return objURL;
};
//Example how to use it:
var params = parseQueryString();
alert(params["foo"]);
您可以使用window.URL类：
new URL(location.href).searchParams.get('year')
// Returns 2008 for href = "http://localhost/search.php?year=2008".
// Or in two steps:
const params = new URL(location.href).searchParams;
const year = params.get('year');
一种非正则表达式方法，您可以简单地按字符 '&' 拆分并遍历键/值对：
function getParameter(paramName) {
var searchString = window.location.search.substring(1),
i, val, params = searchString.split("&");
for (i=0;i<params.length;i++) {
val = params[i].split("=");
if (val[0] == paramName) {
return val[1];
}
}
return null;
}
2020 编辑：
如今，在现代浏览器中，您可以使用URLSearchParams构造函数：
const params = new URLSearchParams('?year=2020&month=02&day=01')
// You can access specific parameters:
console.log(params.get('year'))
console.log(params.get('month'))
// And you can iterate over all parameters
for (const [key, value] of params) {
console.log(`Key: ${key}, Value: ${value}`);
}这个问题很老了，JavaScript 中已经发生了一些变化。你现在可以这样做：
const params = {}
document.location.search.substr(1).split('&').forEach(pair => {
[key, value] = pair.split('=')
params[key] = value
})
你会得到params.year包含2008. 您还将在params对象中获得其他查询参数。
编辑：一个更短/更干净的方法来做到这一点：
const params = new Map(location.search.slice(1).split('&').map(kv => kv.split('=')))
然后，您可以测试该year参数是否存在：
params.has('year') // true
或使用以下命令检索它：
params.get('year') // 2008
编辑 2020
您可以将 URL 参数转换为对象：
const params = location.search.slice(1).split('&').reduce((acc, s) => {
const [k, v] = s.split('=')
return Object.assign(acc, {[k]: v})
}, {})
那么它就可以作为一个普通的 JS 对象使用：
params.year // 2008
以下使用正则表达式并仅搜索 URL 的查询字符串部分。
最重要的是，此方法支持普通参数和数组参数，如
http://localhost/?fiz=zip&foo[]=!!=&bar=7890#hashhashhash
function getQueryParam(param) {
var result = window.location.search.match(
new RegExp("(\\?|&)" + param + "(\\[\\])?=([^&]*)")
);
return result ? result[3] : false;
}
console.log(getQueryParam("fiz"));
console.log(getQueryParam("foo"));
console.log(getQueryParam("bar"));
console.log(getQueryParam("zxcv"));
输出：
zip
!!=
7890
false
其它你可能感兴趣的问题