我如何删除JavaScript中的查询string参数？

除了使用正则expression式之外，是否还有更好的方法从标准Ja​​vaScript中的URLstring中的查询string中删除参数？

这是我到目前为止似乎在我的testing工作，但我不喜欢重新创build查询stringparsing！

function RemoveParameterFromUrl( url, parameter ) { if( typeof parameter == "undefined" || parameter == null || parameter == "" ) throw new Error( "parameter is required" ); url = url.replace( new RegExp( "\\b" + parameter + "=[^&;]+[&;]?", "gi" ), "" ); "$1" ); // remove any leftover crud url = url.replace( /[&;]$/, "" ); return url; } 

Answer 1

 "[&;]?" + parameter + "=[^&;]+" 

似乎危险，因为它参数'酒吧'将匹配：

 ?a=b&foobar=c 

如果parameter包含RegExp中特殊的字符（如“。”），也会失败。 它不是一个全局正则expression式，所以它只会删除一个参数的实例。

我不会用这个简单的RegExp，我会parsing参数，并失去你不想要的。

 function removeURLParameter(url, parameter) { //prefer to use l.search if you have a location/link object var urlparts= url.split('?'); if (urlparts.length>=2) { var prefix= encodeURIComponent(parameter)+'='; var pars= urlparts[1].split(/[&;]/g); //reverse iteration as may be destructive for (var i= pars.length; i-- > 0;) { //idiom for string.startsWith if (pars[i].lastIndexOf(prefix, 0) !== -1) { pars.splice(i, 1); } } url= urlparts[0] + (pars.length > 0 ? '?' + pars.join('&') : ""); return url; } else { return url; } } 

Answer 2

从bobince复制复制，但支持查询string中的问号，例如

http://www.google.com/search?q=test???+something&aq=f

在URL中有多个问号是否有效？

 function removeUrlParameter(url, parameter) { var urlParts = url.split('?'); if (urlParts.length >= 2) { // Get first part, and remove from array var urlBase = urlParts.shift(); // Join it back up var queryString = urlParts.join('?'); var prefix = encodeURIComponent(parameter) + '='; var parts = queryString.split(/[&;]/g); // Reverse iteration as may be destructive for (var i = parts.length; i-- > 0; ) { // Idiom for string.startsWith if (parts[i].lastIndexOf(prefix, 0) !== -1) { parts.splice(i, 1); } } url = urlBase + '?' + parts.join('&'); } return url; } 

Answer 3

任何对正则expression式解决scheme感兴趣的人，我已经把这个函数放在一起，添加/删除/更新查询string参数。 不提供值将删除参数，提供一个将添加/更新参数。 如果没有提供URL，它将从window.location中抓取。 这个解决scheme也考虑到了URL的锚点。

 function UpdateQueryString(key, value, url) { if (!url) url = window.location.href; var re = new RegExp("([?&])" + key + "=.*?(&|#|$)(.*)", "gi"), hash; if (re.test(url)) { if (typeof value !== 'undefined' && value !== null) return url.replace(re, '$1' + key + "=" + value + '$2$3'); else { hash = url.split('#'); url = hash[0].replace(re, '$1$3').replace(/(&|\?)$/, ''); if (typeof hash[1] !== 'undefined' && hash[1] !== null) url += '#' + hash[1]; return url; } } else { if (typeof value !== 'undefined' && value !== null) { var separator = url.indexOf('?') !== -1 ? '&' : '?'; hash = url.split('#'); url = hash[0] + separator + key + '=' + value; if (typeof hash[1] !== 'undefined' && hash[1] !== null) url += '#' + hash[1]; return url; } else return url; } } 

UPDATE

删除查询string中的第一个参数时出现了一个错误，我重写了正则expression式，并testing以包含修复。

更新2

@schellmax更新修复在hashtag之前直接删除querystringvariables时hashtag符号丢失的情况

Answer 4

我没有看到正则expression式解决scheme的主要问题。 但是，不要忘记保留片段标识符（ #后的文本）。

这是我的解决scheme：

 function RemoveParameterFromUrl(url, parameter) { return url .replace(new RegExp('[?&]' + parameter + '=[^&#]*(#.*)?$'), '$1') .replace(new RegExp('([?&])' + parameter + '=[^&]*&'), '$1'); } 

为了避免这一点，是的 – 你需要逃脱. 参数名称中的字符。

Answer 5

以上版本为function

 function removeURLParam(url, param) { var urlparts= url.split('?'); if (urlparts.length>=2) { var prefix= encodeURIComponent(param)+'='; var pars= urlparts[1].split(/[&;]/g); for (var i=pars.length; i-- > 0;) if (pars[i].indexOf(prefix, 0)==0) pars.splice(i, 1); if (pars.length > 0) return urlparts[0]+'?'+pars.join('&'); else return urlparts[0]; } else return url; } 

Answer 6

假设你想从URI中删除key = val参数：

 function removeParam(uri) { return uri.replace(/([&\?]key=val*$|key=val&|[?&]key=val(?=#))/, ''); } 

Answer 7

下面是一个完整的函数来添加和删除基于这个问题的参数和这个github的要点： https ： //gist.github.com/excalq/2961415

 var updateQueryStringParam = function (key, value) { var baseUrl = [location.protocol, '//', location.host, location.pathname].join(''), urlQueryString = document.location.search, newParam = key + '=' + value, params = '?' + newParam; // If the "search" string exists, then build params from it if (urlQueryString) { updateRegex = new RegExp('([\?&])' + key + '[^&]*'); removeRegex = new RegExp('([\?&])' + key + '=[^&;]+[&;]?'); if( typeof value == 'undefined' || value == null || value == '' ) { // Remove param if value is empty params = urlQueryString.replace(removeRegex, "$1"); params = params.replace( /[&;]$/, "" ); } else if (urlQueryString.match(updateRegex) !== null) { // If param exists already, update it params = urlQueryString.replace(updateRegex, "$1" + newParam); } else { // Otherwise, add it to end of query string params = urlQueryString + '&' + newParam; } } window.history.replaceState({}, "", baseUrl + params); }; 

你可以添加这样的参数：

 updateQueryStringParam( 'myparam', 'true' ); 

并像这样删除它：

 updateQueryStringParam( 'myparam', null ); 

在这个线程很多人说，正则expression式可能不是最好的/稳定的解决scheme…所以我不是100％确定，如果这件事有一些缺陷，但据我testing它工作得很好。

Answer 8

你应该使用一个库来进行URI操作，因为它比表面看起来要复杂得多。 看看： http ： //medialize.github.io/URI.js/

Answer 9

我使用jQuery。

 function removeParam(key) { var url = document.location.href; params = url.split('?'); if (params.length == 1) return; url = params[0] + '?'; params = params[1]; params = params.split('&'); $.each(params, function (index, value) { var v = value.split('='); if (v[0] != key) url += value + '&'; }); url = url.replace(/&$/, ''); url = url.replace(/\?$/, ''); document.location.href = url; } 

Answer 10

现代浏览器提供URLSearchParams接口来处理search参数。 其中有delete方法，删除参数的名称。

 if (typeof URLSearchParams !== 'undefined') { const params = new URLSearchParams('param1=1&param2=2&param3=3') console.log(params.toString()) params.delete('param2') console.log(params.toString()) } else { console.log(`Your browser ${navigator.appVersion} does not support URLSearchParams`) } 

Answer 11

从我可以看到，以上都不能处理正常的参数和数组参数。 这是一个。

 function removeURLParameter(param, url) { url = decodeURI(url).split("?"); path = url.length == 1 ? "" : url[1]; path = path.replace(new RegExp("&?"+param+"\\[\\d*\\]=[\\w]+", "g"), ""); path = path.replace(new RegExp("&?"+param+"=[\\w]+", "g"), ""); path = path.replace(/^&/, ""); return url[0] + (path.length ? "?" + path : ""); } function addURLParameter(param, val, url) { if(typeof val === "object") { // recursively add in array structure if(val.length) { return addURLParameter( param + "[]", val.splice(-1, 1)[0], addURLParameter(param, val, url) ) } else { return url; } } else { url = decodeURI(url).split("?"); path = url.length == 1 ? "" : url[1]; path += path.length ? "&" : ""; path += decodeURI(param + "=" + val); return url[0] + "?" + path; } } 

如何使用它：

 url = location.href; -> http://example.com/?tags[]=single&tags[]=promo&sold=1 url = removeURLParameter("sold", url) -> http://example.com/?tags[]=single&tags[]=promo url = removeURLParameter("tags", url) -> http://example.com/ url = addURLParameter("tags", ["single", "promo"], url) -> http://example.com/?tags[]=single&tags[]=promo url = addURLParameter("sold", 1, url) -> http://example.com/?tags[]=single&tags[]=promo&sold=1 

当然，要更新参数，只需删除然后添加。 随意为它做一个虚拟的function。

Answer 12

在这个线程上的所有响应都有一个缺陷，就是它们不保留URL的锚点/片段部分。

所以如果你的url是这样的：

 http://dns-entry/path?parameter=value#fragment-text 

你replace'参数'

你会失去你的片段文本。

以下是适应以前的答案（通过LukePH的bobince）解决这个问题：

 function removeParameter(url, parameter) { var fragment = url.split('#'); var urlparts= fragment[0].split('?'); if (urlparts.length>=2) { var urlBase=urlparts.shift(); //get first part, and remove from array var queryString=urlparts.join("?"); //join it back up var prefix = encodeURIComponent(parameter)+'='; var pars = queryString.split(/[&;]/g); for (var i= pars.length; i-->0;) { //reverse iteration as may be destructive if (pars[i].lastIndexOf(prefix, 0)!==-1) { //idiom for string.startsWith pars.splice(i, 1); } } url = urlBase + (pars.length > 0 ? '?' + pars.join('&') : ''); if (fragment[1]) { url += "#" + fragment[1]; } } return url; } 

Answer 13

ssh_imov的解决scheme的修改版本

 function removeParam(uri, keyValue) { var re = new RegExp("([&\?]"+ keyValue + "*$|" + keyValue + "&|[?&]" + keyValue + "(?=#))", "i"); return uri.replace(re, ''); } 

像这样打电话

 removeParam("http://google.com?q=123&q1=234&q2=567", "q1=234"); // returns http://google.com?q=123&q2=567 

Answer 14

这将返回没有任何GET参数的URL：

 var href = document.location.href; var search = document.location.search; var pos = href.indexOf( search ); if ( pos !== -1 ){ href = href.slice( 0, pos ); console.log( href ); } 

Answer 15

如果你使用jQuery，有一个好的查询string操作插件：

• http://plugins.jquery.com/project/query-object

Answer 16

 function removeQueryStringParameter(uri, key, value) { var re = new RegExp("([?&])" + key + "=.*?(&|$)", "i"); var separator = uri.indexOf('?') !== -1 ? "&" : "?"; if (uri.match(re)) { return uri.replace(re, ''); } }