Is there any method to get the URL without query string?

Question

I have a URL like http://localhost/dms/mduserSecurity/UIL/index.php?menu=true&submenu=true&pcode=1235.

I want to get the URL without the query string: http://localhost/dms/mduserSecurity/UIL/index.php.

Is there any method for this in JavaScript? Currently I am using document.location.href, but it returns the complete URL.

possible duplicate of [Remove querystring from URL](http://stackoverflow.com/questions/2540969/remove-querystring-from-url) — Alex Angas, Jan 20 '14 at 05:01

score 456 · Accepted Answer · edited Oct 11 '21 at 09:08

456

Try this:

let path = window.location.href.split('?')[0]
console.log({path})

edited Oct 11 '21 at 09:08

Teocci

7,189
1
50
48

answered Apr 28 '11 at 11:01

tradyblix

7,439
3
25
29

13

@Lincoln - Why? I see no reason that this would be unsafe. It is also within specs (both the specs for what window.location.href should return and the specs for how URL's work) so it shouldn't have any future problems. It's more easily read and understood for cleaner code. It's shorter for smaller code. And lastly it's less intense and less complicated than Felix's answer. Not saying Felix is wrong, but am saying that without some sort of specific example of failure/insecurity that this answer is superior in pretty much every way. – Jimbo Jonny Sep 22 '12 at 22:16
3

you should use window.location.pathname ..etc as in other answers – Muayyad Alsadi Aug 21 '13 at 11:43
25

@JimboJonny @Marcel This doesn't handle fragment identifiers (e.g. the `#` term in http://stackoverflow.com/questions/5817505#5817548). You'd have to use regex or use multiple .split() functions, at which point you've lost the value of this being a "simple" answer at cleansing a URL. Granted this is technically beyond the scope of the question, but I'd say it's still relevant. – andrewb Sep 04 '13 at 01:41
5

While it is accurate that this does not handle fragment identifiers, the asker did not ask for a completely sanitized URL. He asked specifically for a url with no query string, and this answer delivers exactly that. The same URL, with the query string removed. – Drew Major Mar 15 '18 at 18:46
It also loses the fragment identifiers which is not what was asked for. – Utsav Chatterjee Aug 19 '21 at 09:44

score 414 · Answer 2 · edited Oct 11 '21 at 09:11

414

Read about Window.location and the Location interface:

const urlPieces = [location.protocol, '//', location.host, location.pathname]
let url = urlPieces.join('')

console.log({urlPieces, url})

edited Oct 11 '21 at 09:11

Teocci

7,189
1
50
48

answered Apr 28 '11 at 11:03

Felix Kling

795,719
175
1,089
1,143

36

Or if using es6 you can use a string literal ``${location.protocol}//${location.host}${location.pathname}`` – alexreardon Aug 29 '16 at 23:42
3

Though note that `pathname` may [drop the leading `/` (until IE 11?)](https://developer.mozilla.org/en-US/docs/Web/API/Location#Browser_compatibility). Ah, IE, always a snowflake, ain't ya? – ruffin Jan 28 '20 at 19:29
Don't forget location.hash (in some circustances for example in a vuejs project) it would be needed – Giuseppe Apr 07 '21 at 17:03

score 61 · Answer 3 · answered Apr 28 '11 at 11:02

61

location.toString().replace(location.search, "")

answered Apr 28 '11 at 11:02

Quentin

914,110
126
1,211
1,335

21

This is a very undervalued answer. It's the only one that exactly answers the question. Even shorter option: `location.href.replace(location.search, '')` – Guido Bouman Jun 25 '15 at 08:13
2

what about there is fragment part e.g. domain.com/?x=1#top – Onur Topal Apr 08 '16 at 05:22
4

There are 10 answers on this question. Only one of them preserves the hash (*which doesn't exist on the URL the question is asking about anyway*). Why are there two comments pointing out that this answer doesn't preserve the non-existent hash but not any of the others? – Quentin Sep 09 '16 at 13:15
This is also the easiest way to decide whether one wants to keep the query string, the hash part, or both. – Francesco Marchetti-Stasi Dec 13 '22 at 11:41

score 33 · Answer 4 · answered Mar 07 '13 at 15:32

33

var url = window.location.origin + window.location.pathname;

answered Mar 07 '13 at 15:32

Jason

2,271
2
24
23

6

down-voted because origin is not supported in IE11 :-( – George May 06 '14 at 19:24
10

Why would you down-vote something just because it doesn't work in a particular browser? A lot of places still use IE10 as a standard because of applications that they use. – Brad Apr 29 '16 at 18:01
1

Works in IE11.309.16299.0 – Ryan Burbidge Mar 30 '18 at 18:49
2

This is the best answer in 2022. – Visualise Mar 31 '22 at 06:10

score 18 · Answer 5 · answered Jan 14 '14 at 05:57

18

If you also want to remove hash, try this one: window.location.href.split(/[?#]/)[0]

answered Jan 14 '14 at 05:57

user1079877

9,008
4
43
54

score 16 · Answer 6 · answered May 19 '19 at 02:06

16

Here's an approach using the URL() interface:

new URL(location.pathname, location.href).href

answered May 19 '19 at 02:06

s4y

50,525
12
70
98

Andrew Faulkner · Answer 7 · 2015-03-17T15:20:39.103

To get every part of the URL except for the query:

var url = (location.origin).concat(location.pathname).concat(location.hash);

Note that this includes the hash as well, if there is one (I'm aware there's no hash in your example URL, but I included that aspect for completeness). To eliminate the hash, simply exclude .concat(location.hash).

It's better practice to use concat to join Javascript strings together (rather than +): in some situations it avoids problems such as type confusion.

score 6 · Answer 8 · answered Apr 28 '11 at 11:05

6

Try:

document.location.protocol + '//' +
document.location.host +
document.location.pathname;

(NB: .host rather than .hostname so that the port gets included too, if necessary)

answered Apr 28 '11 at 11:05

Alnitak

334,560
70
407
495

score 5 · Answer 9 · answered Apr 28 '11 at 11:03

5

just cut the string using split (the easy way):

var myString = "http://localhost/dms/mduserSecurity/UIL/index.php?menu=true&submenu=true&pcode=1235"
var mySplitResult = myString.split("?");
alert(mySplitResult[0]);

answered Apr 28 '11 at 11:03

pleasedontbelong

19,542
12
53
77

score 2 · Answer 10 · answered May 01 '17 at 20:17

2

How about this: location.href.slice(0, - ((location.search + location.hash).length))

answered May 01 '17 at 20:17

LI XiangChen

61
3

score 2 · Answer 11 · answered Apr 28 '11 at 11:03

Use properties of window.location

var loc = window.location;
var withoutQuery = loc.hostname + loc.pathname;
var includingProtocol = loc.protocol + "//" + loc.hostname + loc.pathname;

You can see more properties at https://developer.mozilla.org/en/DOM/window.location

score 1 · Answer 12 · answered Apr 28 '11 at 11:04

Here are two methods:

<script type="text/javascript">
    var s="http://localhost/dms/mduserSecurity/UIL/index.php?menu=true&submenu
                                =true&pcode=1235";

    var st=s.substring(0, s.indexOf("?"));

    alert(st);

    alert(s.replace(/\?.*/,''));
</script>

score 1 · Answer 13 · answered Nov 22 '21 at 10:44

You could make use of the URL constructor like this:

const href = 'http://localhost/dms/mduserSecurity/UIL/index.php?menu=true&submenu=true&pcode=1235'; // document.location.href
const url = new URL(href);
const noSearchUrl = href.replace(url.search, '');
console.log(noSearchUrl);

score 1 · Answer 14 · answered Oct 13 '22 at 08:46

1

You can create instance of URL and then clear the query string:

const url = new URL(document.location.href);
url.search = '';
console.log(url.href);

answered Oct 13 '22 at 08:46

Vladan Kudláč

11
1

score 0 · Answer 15 · answered May 09 '20 at 00:34

Just add these two lines to $(document).ready in JS as follow:

$(document).ready(function () {
 $("div.sidebar nav a").removeClass("active");
        $('nav a[href$="'+ window.location.pathname.split("?")[0] +'"]').addClass('active');
});

it is better to use the dollar sign ($) (End with)

$('nav a[href$

instead of (^) (Start with)

$('nav a[href^

because, if you use the (^) sign and you have nested URLs in the navigation menu, (e.g "/account" and "/account/roles")

It will active both of them.

score 0 · Answer 16 · answered Jan 29 '21 at 02:09

0

window.location.href.split("#")[0].split("?")[0]

answered Jan 29 '21 at 02:09

BaiJiFeiLong

3,716
1
30
28

score 0 · Answer 17 · answered Mar 30 '23 at 06:14

0

What I would do in 2023:

const windowUrl = window.location.href;
const { origin, pathname } = new URL(windowUrl);
const urlWithoutQueryOrHash = `${origin}${pathname}`;

answered Mar 30 '23 at 06:14

Manu Geo

1
2

Ammar Al-Habib · Answer 18 · 2021-07-17T10:10:24.680

If you are using navigation bar and want to get the pure url after clicking on the side bar navigation, then the following code might be helpful:

$(document).ready(function () {
    $("div.sidebar nav a").removeClass("active");
    var urlPath = window.location.pathname.split("?")[0];
    var nav = $('div.sidebar nav a').filter(function () {
        return $(this).attr('href').toLowerCase().indexOf(urlPath.toLocaleLowerCase()) > -1;
    });
    $(nav).each(function () {
        if ($(this).attr("href").toLowerCase() == urlPath.toLocaleLowerCase())
            $(this).addClass('active');
    });
});

Is there any method to get the URL without query string?

18 Answers18

Linked

Related