PSD to HTML conversion PSD to HTML conversion PSD2HTML.com with over 300 professionals takes the designs to HTML and beyond

Code Snippet

Home » Code Snippets » JavaScript » Get URL and URL Parts in JavaScript

Get URL and URL Parts in JavaScript

JavaScript can access the current URL in parts. For this URL:

http://css-tricks.com/example/index.html

  • window.location.protocol = "http"
  • window.location.host = "css-tricks.com"
  • window.location.pathname = "example/index.html"

So to get the full URL path in JavaScript:

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

If you need to breath up the pathname, for example a URL like http://css-tricks.com/blah/blah/blah/index.html, you can split the string on "/" characters

var pathArray = window.location.pathname.split( '/' );

Then access the different parts by the parts of the array, like

var secondLevelLocation = pathArray[0];

To put that pathname back together, you can stitch together the array and put the "/"'s back in:

var newPathname = "";
for ( i = 0; i pathArray.length; i++ ) {
  newPathname += "/";
  newPathname += pathArray[i];
}

Subscribe to The Thread

  1. Really cool! Thanks!

  2. Just to mention that there was a small error:

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

    Should have been:

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

    • Thanks Ben, fixed that.

    • Just testing in ff 3.6.10 and window.location.protocol = “http:” so the is the original code (var newURL = window.location.protocol + “//” + window.location.host + “/” + window.location.pathname;) correct ?

  3. I will some day become like you guy, who knows maybe even bettter.

  4. I have a problem in webtrends reporting where the URL of the page isn’t showing up.

    The URL below is a pop-up box containing a form, but the current tracking is only capturing up to the ‘?’ and so in the reporting the page name is being displayed as ‘/’ – which of course, is not correct.

    The URL is in the format http://www.domain.com/?formpage=9

    Is there a way to extract the parameters at the end of this URL?

    Thanks,

    Chris

  5. How DOES the computer know location.pathname? Can it be a filename.location.pathname instead of window.location.pathname? It is strictly for commercial purposes.

  6. I fix the “:” error

    window.location.protocol.replace(/\:/g, ”) + “://” + window.location.host

    ie and firefox not send protocol in the same way

  7. hi chris l would like to know how l can get the full url from ” a”(hyperlink) on click and use it with .load javascript . becaus l want to load it in a div thanks

  8. alert($(location).attr(‘hash’));

  9. Reza Baiat

    var fullUrl = window.location.pathname + window.location.search;
    alert(fullUrl);

    get url with parameters

  10. How to grab the page URL when submitting enquiry form

    I’m a newbie who’s stuck trying implement something like this form a web form

    Can someone please provide an example of how this could be done?

    Thanks!!

Speak, my friend

At this moment, you have an awesome opportunity* to be the person your mother always wanted you to be: kind, helpful, and smart. Do that, and we'll give you a big ol' gold star for the day (literally).

Posting tips:
  • You can use basic HTML
  • When posting code, please turn all
    < characters into &lt;
  • If the code is multi-line, use
    <pre><code></code></pre>
Thank you,
~ The Management ~