Get current URL in JavaScript?

Question

I am using jQuery. How do I get the path of the current URL and assign it to a variable?

Example URL:

http://localhost/menuname.de?foo=bar&amp;number=0

I think the question should be restored to asking for jQuery, since there is an answer for that, regardless of whether jQuery is required to accomplish the task. — goodeye, Jun 3 '14 at 1:25
@goodeye No, there is no jQuery way to get the location; as of the jQuery bug tracker: »It may have worked but it was never supported or documented. Simply use document.location.href which is faster, simpler, and easier to understand.« In other words, some folks used jQuery to get the location, but they relied on a bug, rather than feature. See: bugs.jquery.com/ticket/7858 — feeela, Jul 15 '15 at 14:05

Peter Mortensen · Accepted Answer · 2014-12-13 19:10:53Z

up vote 1465 down vote accepted

To get the path, you can use:

var pathname = window.location.pathname; // Returns path only
var url      = window.location.href;     // Returns full URL

edited Dec 13 '14 at 19:10

Peter Mortensen

9,352116698

answered Jan 2 '09 at 6:57

Ryan Doherty

22.9k33756

64

Properties of the location object: developer.mozilla.org/en/DOM/window.location – bentford May 6 '10 at 23:28

89

Far from killing it, jQuery's given Javascript a new life. Do new C#/Java programmers understand pointers? No. Do they need to? Not really, newer abstractions are powerful enough for it not to matter.. – flesh Jan 11 '11 at 22:10

172

"How do I XYZ in jQuery" and the answer being plain javascript is pretty common. You may know how to do something in plain javascript; however, due to browser inconsistencies you may prefer to do it the "jQuery" way. I remember pre-jQuery or framework I would first check browser and then do what I wanted a handful of ways. So is jQuery killing plain js... yes, thank god, but it is also making it usable. – Parris Jan 20 '11 at 21:14

7

this doesn't work for the full url. for example. for "mail.google.com/mail/u/0/#mbox/13005b79fe72f448"; this will only return /mail/u/0 – dwaynemac May 19 '11 at 18:53

9

Ummm,... window.location.pathname only gets the URL up the "?" and doesn't get the query params as asked in the question. – johntrepreneur Dec 28 '12 at 19:05

| show 6 more comments

Peter Mortensen · Answer 2 · 2013-08-03 12:29:07Z

up vote 718 down vote

In pure jQuery style:

$(location).attr('href');

The location object also has other properties, like host, hash, protocol, and pathname.

edited Aug 3 '13 at 12:29

Peter Mortensen

9,352116698

answered May 19 '10 at 12:42

Boris Guéry

30.5k43267

42

Apparently, using $(location) in jQuery is unsupported and advised against: bugs.jquery.com/ticket/7858 – Peter Aug 24 '11 at 14:41

7

@Peter Bug closed as invalid. – mc10 Dec 19 '11 at 19:40

17

@mc10: The "invalid" part applies to the request to support $(location); this should NOT be used. – Peter Dec 30 '11 at 10:31

5

This answer is not needed, and question and answer can be updated to not use jquery. Reasons can be found here bugs.jquery.com/ticket/7858#comment:4 – Vishwanath Jan 19 '12 at 5:31

6

@HaralanDobrev: You shouldn't be able to do .attr() on location. (1) It's not an element, so $(location) is shady at best, and (2) even if it worked, you should be using .prop() to get properties. .attr() is for HTML attributes. – cHao May 20 '13 at 6:09

| show 1 more comment

Anil · Answer 3 · 2015-04-22 04:50:11Z

up vote 315 down vote

http://www.refulz.com:8082/index.php#tab2?foo=789

Property    Result
------------------------------------------
host        www.refulz.com:8082
hostname    www.refulz.com
port        8082
protocol    http:
pathname    index.php
href        http://www.refulz.com:8082/index.php#tab2
hash        #tab2
search      ?foo=789

var x = $(location).attr('<property>');

This will work only if you have jQuery. For example:

<html>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js">
</script>
  $(location).attr('href');      // http://www.refulz.com:8082/index.php#tab2
  $(location).attr('pathname');  // index.php
</script>
</html>

edited Apr 22 '15 at 4:50

Anil

551410

answered Jan 30 '13 at 21:10

rizon

4,87311510

9

It's the same explanation that the one before, but with all the element of the object. Great Answer. – Oskar Calvo Sep 28 '13 at 8:09

Should be /index.php instead of index.php for the pathname. – Andrea Feb 1 at 14:28

add a comment |

zkanoca · Answer 4 · 2013-12-17 08:03:31Z

up vote 43 down vote

If you need the hash parameters present in the URL, window.location.href may be a better choice.

window.location.pathname
=> /search

window.location.href 
 => www.website.com/search#race_type=1

edited Dec 17 '13 at 8:03

zkanoca

3,93231849

answered May 9 '10 at 16:39

jlfenaux

1,8061625

2

If someone needs only hash tag than can call window.location.href – Amit Patel Feb 21 '11 at 6:47

12

I think @AmitPatel means window.location.hash – memeLab Oct 30 '12 at 18:21

add a comment |

Peter Mortensen · Answer 5 · 2011-06-03 15:32:57Z

up vote 37 down vote

You'll want to use JavaScript's built-in window.location object.

edited Jun 3 '11 at 15:32

Peter Mortensen

9,352116698

answered Jan 2 '09 at 6:50

clawr

5,16331513

3

this will not return items after '?' in location. – majidR Jun 19 '13 at 8:42

@majidgeek works for me in Firefox, Chrome, and IE. Can you provide a test case of this breaking? – Barney Sep 5 '13 at 11:00

2

can confirm at least in the console that window.location.pathname does not retrieve anything after the ? – worc Mar 4 '14 at 21:07

add a comment |

Peter Mortensen · Answer 6 · 2011-05-26 20:11:00Z

Just add this function in JavaScript, and it will return the absolute path of the current path.

function getAbsolutePath() {
    var loc = window.location;
    var pathName = loc.pathname.substring(0, loc.pathname.lastIndexOf('/') + 1);
    return loc.href.substring(0, loc.href.length - ((loc.pathname + loc.search + loc.hash).length - pathName.length));
}

I hope it works for you.

Peter Mortensen · Answer 7 · 2011-06-03 15:30:22Z

This is a more complicated issue than many may think. Several browsers support built-in JavaScript location objects and associated parameters/methods accessible through window.location or document.location. However, different flavors of Internet Explorer (6,7) don't support these methods in the same way, (window.location.href? window.location.replace() not supported) so you have to access them differently by writing conditional code all the time to hand-hold Internet Explorer.

So, if you have jQuery available and loaded, you might as well use jQuery (location), as the others mentioned because it resolves these issues. If however, you are doing-for an example-some client-side geolocation redirection via JavaScript (that is, using Google Maps API and location object methods), then you may not want to load the entire jQuery library and write your conditional code that checks every version of Internet Explorer/Firefox/etc.

Internet Explorer makes the front-end coding cat unhappy, but jQuery is a plate of milk.

Additionaly: bugs.jquery.com/ticket/8138. In jQuery 1.8.0 source there is comment: // #8138, IE may throw an exception when accessing // a field from window.location if document.domain has been set. — Jan Święcki, Nov 30 '12 at 9:17

Peter Mortensen · Answer 8 · 2013-08-03 12:28:27Z

up vote 17 down vote

For the host name only, use:

window.location.hostname

edited Aug 3 '13 at 12:28

Peter Mortensen

9,352116698

answered Oct 5 '10 at 9:50

Mahmoud Farahat

2,23542040

add a comment |

Peter Mortensen · Answer 9 · 2013-08-03 12:24:59Z

up vote 13 down vote

This will also work:

var currentURL = window.location.href;

edited Aug 3 '13 at 12:24

Peter Mortensen

9,352116698

answered Jul 26 '12 at 6:14

Suresh Pattu

1,92482653

This gives the full URL which most people looks for. – Kemal Sep 29 '13 at 17:38

add a comment |

Gaurav · Answer 10 · 2016-01-04 05:34:07Z

up vote 10 down vote

window.location is an object in javascript. it returns following data

window.location.host          #returns host
window.location.hostname      #returns hostname
window.location.path          #return path
window.location.href          #returns full current url
window.location.port          #returns the port
window.location.protocol      #returns the protocol

in jquery you can use

$(location).attr('host');        #returns host
$(location).attr('hostname');    #returns hostname
$(location).attr('path');        #returns path
$(location).attr('href');        #returns href
$(location).attr('port');        #returns port
$(location).attr('protocol');    #returns protocol

edited Jan 4 at 5:34

answered Apr 6 '15 at 9:54

Gaurav

823322

2

Though windows.location is kind of funny, it should be window.location. – some-non-descript-user Jan 2 at 10:36

Thank you for notifying . – Gaurav Jan 4 at 5:34

add a comment |

dacopenhagen · Answer 11 · 2012-11-28 23:11:38Z

up vote 9 down vote

You can log window.location and see all the options, for just the URL use:

window.location.origin

for the whole path use:

window.location.href

there's also location.__

.host
.hostname
.protocol
.pathname

answered Nov 28 '12 at 23:11

dacopenhagen

7722821

Shouldn't use it because location.origin does not work in Internet Explorer – licancabur Jun 1 '15 at 10:33

add a comment |

Peter Mortensen · Answer 12 · 2013-08-03 12:27:52Z

up vote 6 down vote

If there is someone who wants to concatenate the URL and hash tag, combine two functions:

var pathname = window.location.pathname + document.location.hash;

edited Aug 3 '13 at 12:27

Peter Mortensen

9,352116698

answered May 17 '13 at 5:39

Nis

1,044718

To clarify: you don't need to use jQuery at all, the javascript function above will return what the OP was asking for? – GHC May 17 '13 at 6:08

add a comment |

user1570636 · Answer 13 · 2014-03-14 15:36:35Z

up vote 6 down vote

This will return the absolute URL of the current page using JavaScript/jQuery.

document.URL
$("*").context.baseURI
location.href

edited Mar 14 '14 at 15:36

answered May 16 '13 at 8:05

user1570636

17624

add a comment |

Aram Kocharyan · Answer 14 · 2012-08-25 11:35:19Z

up vote 5 down vote

I have this to strip out the GET variables.

var loc = window.location;
var currentURL = loc.protocol + '//' + loc.host + loc.pathname;

answered Aug 25 '12 at 11:35

Aram Kocharyan

11.8k74968

add a comment |

Costa · Answer 15 · 2013-05-21 19:20:09Z

up vote 5 down vote

To get the URL of the parent window from within an iframe:

$(window.parent.location).attr('href');

NB: only works on same domain

edited May 21 '13 at 19:20

answered May 19 '13 at 6:01

Costa

3,6301623

add a comment |

hari maliya · Answer 16 · 2012-11-19 07:00:53Z

up vote 4 down vote

 var currenturl = jQuery(location).attr('href');

answered Nov 19 '12 at 7:00

hari maliya

400215

add a comment |

Peter Mortensen · Answer 17 · 2013-08-03 12:26:09Z

up vote 4 down vote

The following are examples of useful code snippets that can be used – some of the examples use standard JavaScript functions and are not specific to jQuery:

See 8 Useful jQuery Snippets For URL’s & Querystrings.

edited Aug 3 '13 at 12:26

Peter Mortensen

9,352116698

answered Apr 29 '13 at 14:26

Issamovitch

708

add a comment |

Peter Mortensen · Answer 18 · 2014-12-13 19:17:35Z

Here is an example to get the current URL using jQuery and JavaScript:

$(document).ready(function() {

    //jQuery
    $(location).attr('href');

    //Pure JavaScript
    var pathname = window.location.pathname;

    // To show it in an alert window
    alert(window.location);
});


$.getJSON("idcheck.php?callback=?", { url:$(location).attr('href')}, function(json){
    //alert(json.message);
});

Peter Mortensen · Answer 19 · 2014-12-13 19:18:17Z

up vote 4 down vote

Use window.location.href. This will give you the complete URL.

edited Dec 13 '14 at 19:18

Peter Mortensen

9,352116698

answered Jul 1 '14 at 9:15

Saikumar Anireddy

606

add a comment |

Peter Mortensen · Answer 20 · 2014-12-13 19:12:19Z

up vote 3 down vote

window.location will give you the current URL, and you can extract whatever you want from it...

edited Dec 13 '14 at 19:12

Peter Mortensen

9,352116698

answered Dec 19 '11 at 10:59

ZMR BINU

72119

add a comment |

Peter Mortensen · Answer 21 · 2014-12-13 19:12:54Z

up vote 3 down vote

If you want to get the path of the root site, use this:

$(location).attr('href').replace($(location).attr('pathname'),'');

edited Dec 13 '14 at 19:12

Peter Mortensen

9,352116698

answered Jun 26 '12 at 21:06

vikas mehta

266618

also add .replace('#','') – Gian Oct 11 '12 at 9:40

wouldn't that be .replace('#.*', '')? Remove not just the hash mark but everything after it as well? – Jonas Kölker Dec 17 '12 at 9:30

add a comment |

Peter Mortensen · Answer 22 · 2014-12-13 19:14:52Z

up vote 2 down vote

var path = location.pathname returns the path of the current URL in jQuery. There is no need to use window.

edited Dec 13 '14 at 19:14

Peter Mortensen

9,352116698

answered Oct 19 '12 at 8:58

Jonathan Lin

5,46833140

add a comment |

Peter Mortensen · Answer 23 · 2015-03-18 19:48:15Z

up vote 1 down vote

See purl.js. This will really help and can also be used, depending on jQuery. Use it like this:

$.url().param("yourparam");

edited Mar 18 '15 at 19:48

Peter Mortensen

9,352116698

answered Feb 3 '15 at 8:02

Chuanshi Liu

13027

add a comment |

Shubham Kumar · Answer 24 · 2016-01-21 15:34:42Z

The Simple Way:

var newURL = window.location.href;

Another Way:

var newURL = window.location.protocol + "//" + window.location.host + "/" + window.location.pathname+window.location.search+window.location.hash;

Source: Get URL and URL Parts in JavaScript

asked	7 years ago
viewed	1172101 times
active	1 month ago

current community

your communities

more stack exchange communities

Get current URL in JavaScript?

24 Answers 24

protected by Community♦ Jan 1 '14 at 17:27

Not the answer you're looking for? Browse other questions tagged javascript jquery url path or ask your own question.

Linked

Hot Network Questions

current community

your communities

more stack exchange communities

Get current URL in JavaScript?

24 Answers 24

protected by Community♦ Jan 1 '14 at 17:27

Not the answer you're looking for? Browse other questions tagged javascript jquery url path or ask your own question.

Linked

Related

Hot Network Questions