Get path and query string from URL using javascript

Question

I have this:

http://127.0.0.1:8000/found-locations/?state=--&km=km

I want this:

found-locations/?state=--&km=km

how do i do this in javascript?

I tried window.location.href but it is giving me whole url
I tried window.location.pathname.substr(1) but it is giving me found-locations/

Fillet

See this question: #442255 – Ibis

Answer 1

Use location.pathname and location.search:

(location.pathname+location.search).substr(1)

Scribe

What is the browser support for this, I found: developer.mozilla.org/en-US/docs/Web/API/… – Blouson

What is .substr(1) for? – Firepower

@AmitTripathi the .substr(1) is to remove the slash at the start – Hatshepsut

Answer 2

window.location.pathname + window.location.search

Will get you the base url /found-locations plus the query string ?state=--&km=km

Teneshatenesmus

Answer 3

If your url is a string, you can create URL object and use pathname and search property.

 let strurl = 'http://www.test.com/param1/param2?test=abc';
 let url = new URL(strurl)
 let pathandQuery = url.pathname + url.search;

let strurl = 'http://www.test.com/param1/param2?test=abc';
let url = new URL(strurl)
let pathandQuery = url.pathname + url.search;

console.log(pathandQuery);

Licking

Not supported by IE – Spinks

Answer 4

get all path, query and even hash: location.href.replace(location.origin, '')

Biltong

Answer 5

URI.js is a nice JavaScript library for parsing URIs. It can do what you requested with a nice fluent syntax.

Secretarial

Answer 6

/**
 * @returns The path and query string (and possibly the hash fragment) of the current URL.
 */
export const getRelativeUrl = (url: string): string => {
  const urlObject = new URL(url);

  return `${urlObject.pathname}${urlObject.search}${urlObject.hash}`;
};

The cleanest version for getting relative URL.

Heidi