从URL中删除查询字符串

时间:2010-03-29 20:18:32

标签: javascript jquery

在Javascript中从路径中删除查询字符串的简单方法是什么? 我见过一个使用window.location.search的Jquery插件。我不能这样做:我的案例中的URL是一个从AJAX设置的变量。

var testURL = '/Products/List?SortDirection=dsc&Sort=price&Page=3&Page2=3&SortOrder=dsc'

12 个答案:

答案 0 :(得分:309)

获得这个的简单方法是:

function getPathFromUrl(url) {
  return url.split("?")[0];
}

对于那些也希望删除哈希(不是原始问题的一部分)当没有查询字符串存在时,需要更多一点:

function stripQueryStringAndHashFromPath(url) {
  return url.split("?")[0].split("#")[0];
}

修改

@caub(最初是@crl)提出了一个更简单的组合,适用于查询字符串和哈希(虽然它使用RegExp,以防任何人有问题):

function getPathFromUrl(url) {
  return url.split(/[?#]/)[0];
}

答案 1 :(得分:32)

第二次更新:为了提供全面的答案,我正在对各种答案中提出的三种方法进行基准测试。

var testURL = '/Products/List?SortDirection=dsc&Sort=price&Page=3&Page2=3';
var i;

// Testing the substring method
i = 0;
console.time('10k substring');
while (i < 10000) {
    testURL.substring(0, testURL.indexOf('?'));
    i++;
}
console.timeEnd('10k substring');

// Testing the split method
i = 0;
console.time('10k split');
while (i < 10000) {
    testURL.split('?')[0]; 
    i++;
}
console.timeEnd('10k split');

// Testing the RegEx method
i = 0;
var re = new RegExp("[^?]+");
console.time('10k regex');
while (i < 10000) {
    testURL.match(re)[0]; 
    i++;
}
console.timeEnd('10k regex');

Mac OS X 10.6.2上的Firefox 3.5.8中的结果:

10k substring:  16ms
10k split:      25ms
10k regex:      44ms

Mac OS X 10.6.2上的Chrome 5.0.307.11中的结果:

10k substring:  14ms
10k split:      20ms
10k regex:      15ms

请注意,substring方法的功能较差,因为如果URL不包含查询字符串,则返回空字符串。其他两种方法将按预期返回完整的URL。然而,有趣的是,子串方法是最快的,特别是在Firefox中。


第一次更新:实际上,split()方法suggested by Robusto是我之前建议的更好的解决方案,因为即使没有查询字符串它也能正常工作:

var testURL = '/Products/List?SortDirection=dsc&Sort=price&Page=3&Page2=3';
testURL.split('?')[0];    // Returns: "/Products/List"

var testURL2 = '/Products/List';
testURL2.split('?')[0];    // Returns: "/Products/List"

原始答案:

var testURL = '/Products/List?SortDirection=dsc&Sort=price&Page=3&Page2=3';
testURL.substring(0, testURL.indexOf('?'));    // Returns: "/Products/List"

答案 2 :(得分:3)

一种简单的方法是你可以这样做

public static String stripQueryStringAndHashFromPath(String uri) {
 return uri.replaceAll(("(\\?.*|\\#.*)"), "");
}

答案 3 :(得分:2)

如果你进入RegEx ....

var newURL = testURL.match(new RegExp("[^?]+"))

答案 4 :(得分:2)

var path = "path/to/myfile.png?foo=bar#hash";

console.log(
    path.replace(/(\?.*)|(#.*)/g, "")
);

答案 5 :(得分:1)

这可能是个老问题,但我尝试过这种方法来删除查询参数。似乎能够顺利地为我工作,因为我需要重新加载以及删除查询参数。

window.location.href = window.location.origin + window.location.pathname;

此外,由于我使用简单的字符串添加操作,我猜测性能会很好。但仍然值得与this answer

中的片段进行比较

答案 6 :(得分:0)

使用标准URL的方法:

/**
 * @param {string} url - An url starting with /
 */
function getPathname(url) {
  return new URL(`http://_${url}`).pathname
}

getPathname('/foo/bar?cat=5') // /foo/bar

答案 7 :(得分:0)

var u = new URL('https://server.de/test?q#h')
u.hash = ''
u.search = ''
console.log(u.toString())

答案 8 :(得分:0)

我可以理解以前的事情有多痛苦,在现代,您可以像下面这样超级轻松

let url = new URL('https://example.com?foo=1&bar=2&foo=3');
let params = new URLSearchParams(url.search);

// Delete the foo parameter.
params.delete('foo'); //Query string is now: 'bar=2'

// now join the query param and host
let newUrl =  url.origin + '/' + params.toString();

答案 9 :(得分:-1)

如果您需要对网址执行复杂操作,可以查看jQuery url parser plugin

答案 10 :(得分:-1)

如果使用backbone.js(其中包含url anchor作为路线),则可能会显示网址query string

  1. url anchor之前:

    var url = 'http://example.com?a=1&b=3#routepath/subpath';
    
  2. url anchor之后
  3. var url = 'http://example.com#routepath/subpath?a=1&b=3';
    
  4. 解决方案:

    window.location.href.replace(window.location.search, '');
    // run as: 'http://example.com#routepath/subpath?a=1&b=3'.replace('?a=1&b=3', '');
    

答案 11 :(得分:-3)

(() => {
        'use strict';
        const needle = 'SortOrder|Page'; // example
        if ( needle === '' || needle === 'test_string = 'file1_with_extra_underscores_lead.pdf'
filename = os.path.splitext(test_string)[0]
print(filename)  # 'file1_with_extra_underscores_lead'
' ) { 
            return; 
        }           
        const needles = needle.split(/\s*\|\s*/);
        const querystripper = ev => {
                    if (ev) { window.removeEventListener(ev.type, querystripper, true);}
                    try {
                          const url = new URL(location.href);
                          const params = new URLSearchParams(url.search.slice(1));
                          for (const needleremover of needles) {
                                if (params.has(needleremover)) {
                                url.searchParams.delete(needleremover);
                                    window.location.href = url;
                            }
                          }     
                    } catch (ex) { }
        };          
        if (document.readyState === 'loading') {
                 window.addEventListener('DOMContentLoaded', querystripper, true);
        } else {
                 querystripper();
        }
})();

这就是我的做法,并且还具有RegEx支持。