Get the values from the "GET" parameters (JavaScript)

JavaScript itself has nothing built in for handling query string parameters.

Code running in a (modern) browser can use the URL object (a Web API). URL is also implemented by Node.js:

// You can get url_string from window.location.href if you want to work with
// the URL of the current page
var url_string = "http://www.example.com/t.html?a=1&b=3&c=m2-m3-m4-m5"; 
var url = new URL(url_string);
var c = url.searchParams.get("c");
console.log(c);

For older browsers (including Internet Explorer), you can use this polyfill.

You could also use one for URLSearchParams and extract the query string to pass to it with window.location.search.substring(1).

You could also use the code from the original version of this answer that predates URL. The above polyfill is robust and well tested and I strongly recommend it over this though.

You could access location.search, which would give you from the ? character on to the end of the URL or the start of the fragment identifier (#foo), whichever comes first.

Then you can parse it with this:

function parse_query_string(query) {
  var vars = query.split("&");
  var query_string = {};
  for (var i = 0; i < vars.length; i++) {
    var pair = vars[i].split("=");
    var key = decodeURIComponent(pair.shift());
    var value = decodeURIComponent(pair.join("="));
    // If first entry with this name
    if (typeof query_string[key] === "undefined") {
      query_string[key] = value;
      // If second entry with this name
    } else if (typeof query_string[key] === "string") {
      var arr = [query_string[key], value];
      query_string[key] = arr;
      // If third or later entry with this name
    } else {
      query_string[key].push(value);
    }
  }
  return query_string;
}

var query_string = "a=1&b=3&c=m2-m3-m4-m5";
var parsed_qs = parse_query_string(query_string);
console.log(parsed_qs.c);

You can get the query string from the URL of the current page with:

var query = window.location.search.substring(1);
var qs = parse_query_string(query);

Most implementations I've seen miss out URL-decoding the names and the values.

Here's a general utility function that also does proper URL-decoding:

function getQueryParams(qs) {
    qs = qs.split('+').join(' ');

    var params = {},
        tokens,
        re = /[?&]?([^=]+)=([^&]*)/g;

    while (tokens = re.exec(qs)) {
        params[decodeURIComponent(tokens[1])] = decodeURIComponent(tokens[2]);
    }

    return params;
}

//var query = getQueryParams(document.location.search);
//alert(query.foo);

source

function gup( name, url ) {
    if (!url) url = location.href;
    name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
    var regexS = "[\\?&]"+name+"=([^&#]*)";
    var regex = new RegExp( regexS );
    var results = regex.exec( url );
    return results == null ? null : results[1];
}
gup('q', 'hxxp://example.com/?q=abc')

This is an easy way to check just one parameter:

Example URL:

http://myserver/action?myParam=2

Example Javascript:

var myParam = location.search.split('myParam=')[1]

if "myParam" exists in the URL... variable myParam will contain "2", otherwise it will be undefined.

Maybe you want a default value, in that case:

var myParam = location.search.split('myParam=')[1] ? location.search.split('myParam=')[1] : 'myDefaultValue';

Update: This works better:

var url = "http://www.example.com/index.php?myParam=384&login=admin"; // or window.location.href for current url
var captured = /myParam=([^&]+)/.exec(url)[1]; // Value is in [1] ('384' in our case)
var result = captured ? captured : 'myDefaultValue';

And it works right even when URL is full of parameters.

I found this ages ago, very easy:

function getUrlVars() {
    var vars = {};
    var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi,    
    function(m,key,value) {
      vars[key] = value;
    });
    return vars;
  }

Then call it like this:

var fType = getUrlVars()["type"];

You can get the query string in location.search, then you can split everything after the question mark:

var params = {};

if (location.search) {
    var parts = location.search.substring(1).split('&');

    for (var i = 0; i < parts.length; i++) {
        var nv = parts[i].split('=');
        if (!nv[0]) continue;
        params[nv[0]] = nv[1] || true;
    }
}

// Now you can get the parameters you want like so:
var abc = params.abc;

The shortest way:

new URL(location.href).searchParams.get("my_key");

The easiest way using the replace() method:

From the urlStr string:

paramVal = urlStr.replace(/.*param_name=([^&]*).*|(.*)/, '$1');

or from the current URL:

paramVal = document.URL.replace(/.*param_name=([^&]*).*|(.*)/, '$1');

Explanation:

• document.URL - interface returns the document location (page url) as a string.
• replace() - method returns a new string with some or all matches of a pattern replaced by a replacement.
• /.*param_name=([^&]*).*/ - the regular expression pattern enclosed between slashes which means:
  • .* - zero or more of any characters,
  • param_name= - param name which is serched,
  • () - group in regular expression,
  • [^&]* - one or more of any characters excluding &,
  • | - alternation,
  • $1 - reference to first group in regular expression.

var urlStr = 'www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5';
var c = urlStr.replace(/.*c=([^&]*).*|(.*)/, '$1');
var notExisted = urlStr.replace(/.*not_existed=([^&]*).*|(.*)/, '$1');
console.log(`c === '${c}'`);
console.log(`notExisted === '${notExisted}'`);

Elegant, functional style solution

Let's create an object containing URL param names as keys, then we can easily extract the parameter by its name:

// URL: https://example.com/?test=true&orderId=9381  

// Build an object containing key-value pairs
export const queryStringParams = window.location.search
  .split('?')[1]
  .split('&')
  .map(keyValue => keyValue.split('='))
  .reduce<QueryStringParams>((params, [key, value]) => {
    params[key] = value;
    return params;
  }, {});

type QueryStringParams = {
  [key: string]: string;
};


// Return URL parameter called "orderId"
return queryStringParams.orderId;

It's the N++ time I am looking for a clean way to do this.
Will save this here in case I get back cause I know I will...

const parseUrlQuery = (value) => {
  var urlParams = new URL(value).searchParams
  return Array.from(urlParams.keys()).reduce((acc, key) => {
    acc[key] = urlParams.getAll(key)
    return acc
  }, {})
}

console.log(parseUrlQuery('http://url/path?param1=A&param1=B&param2=ABC&param3=61569'))

One liner and IE11 friendly:

> (window.location.href).match('c=([^&]*)')[1]
> "m2-m3-m4-m5"

Here's a short and simple function for getting a single param:

function getUrlParam(paramName) {
    var match = window.location.search.match("[?&]" + paramName + "(?:&|$|=([^&]*))");
    return match ? (match[1] ? decodeURIComponent(match[1]) : "") : null;
}

The handling of these special cases are consistent with URLSearchParams:

• If the parameter is missing, null is returned.

• If the parameter is present but there is no "=" (e.g. "?param"), "" is returned.

Note! If there is a chance that the parameter name can contain special URL or regex characters (e.g. if it comes from user input) you need to escape it. This can easily be done like this:

function getUrlParamWithSpecialName(paramName) {
    return getUrlParam(encodeURIComponent(paramName).replace(/[.*+?^${}()|[\]\\]/g, "\\$&"));
}

window.location.search.slice(1).split('&').reduce((res, val) => ({...res, [val.split('=')[0]]: val.split('=')[1]}), {})

We can get the c parameter values in a simpler way without looping all the parameters, see the below jQuery to get the parameters.

1. To Get the Parameter value:

var url = "www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5";

url.match(**/(c=)[0-9A-Za-z-]+/ig**)[0].replace('c=',"")

(or)

url.match(**/(c=)[0-z-]+/ig**)[0].replace('c=',"")

returns as a string

"m2-m3-m4-m5"

2. To Replace the parameter value:

var url = "www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5";

url.replace(**/(c=)[0-9A-Za-z-]+/ig, "c=m2345"**)

You can simply use core javascript to get the param's key value as a js object:

var url_string = "http://www.example.com/t.html?a=1&b=3&c=m2-m3-m4-m5";
var url = new URL(url_string);
let obj = {};
var c = url.searchParams.forEach((value, key) => {
  obj[key] = value;
});
console.log(obj);

To extract all url params from search object in window.location as json

export const getURLParams = location => {
    const searchParams = new URLSearchParams(location.search)
    const params = {}

    for (let key of searchParams.keys()) {
        params[key] = searchParams.get(key)
    }

    return params
}

console.log(getURLParams({ search: '?query=someting&anotherquery=anotherthing' }))

// --> {query: "someting", anotherquery: "anotherthing"}

Try

url.match(/[?&]c=([^&]*)/)[1]

var url = "www.test.com/t.html?a=1&bc=3&c=m2-m3-m4-m5";

c= url.match(/[?&]c=([^&]*)/)[1];

console.log(c);

This is improvement of Daniel Sokolowski answer Jun 27 '19. Regexp explanation

• [?&] first matched character must be ? or & (to omit param like ac=)
• c= name of parameter with = char at end
• (...) match in first group
• [^&]* zero or more characters ( * ) different (^) than &
• [1] choose first group from array of matches

simplified version, tested

function get(name){
    var r = /[?&]([^=#]+)=([^&#]*)/g,p={},match;
    while(match = r.exec(window.location)) p[match[1]] = match[2];
    return p[name];
}

usage:

var parameter = get['parameter']

I prefer to use available resources rather than reinventing how to parse those params.

1. Parse the URL as an object
2. Extract the search params part
3. Transform the searchParams from an Iterator to an Array with array expansion.
4. Reduce the key-value array into an object.

const url = 'http://www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5';
const params = [... new URL(url).searchParams.entries()]
  .reduce((a, c) => Object.assign(a, {[c[0]]:c[1]}), {})

console.log(params);

function parseUrl(url){
    let urlParam = url.split("?")[1];
    console.log("---------> URL param : " + urlParam);
    urlParam = urlParam.split("&");
    let urlParamObject = {};
    for(let i=0;i < urlParam.length;i++){
        let tmp = urlParam[i].split("=");
        urlParamObject[tmp[0]] = tmp[1];
    }
    return urlParamObject;
}

let param = parseUrl(url);
param.a // output 10
param.b // output 20

Get a single param value:

function getQueryParameter(query, parameter) {
return (window.location.href.split(parameter + '=')[1].split('&')[0]);}

you can do it by bellow function:

function getParameter(parameterName){
        let paramsIndex = document.URL.indexOf("?");
        let params="";
        if(paramsIndex>0)
            params=document.URL.substring(paramsIndex+1, document.URL.length).split("&");
        let result = [];
        for(let i=0;i<params.length;i++)
        {
            console.warn(params[i].split("=")[0].toString()+ "," + params[i].split("=")[1].toString());
            var obj = {"key":params[i].split("=")[0].toString(),"value":params[i].split("=")[1].toString()};
            result.push(obj);
        }
        return passedValue = result.find(x=>x.key==parameterName).value;
    }

now you can get parameter value with getParameter("parameterName")

This works:

function getURLParameter(name) {
  return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.href) || [null, ''])[1].replace(/\+/g, '%20')) || null;
}

I didn't get any of the other top answers to work.

you can run this function

    function getUrlVars()
    {
        var vars = [], hash;
        var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
        for(var i = 0; i < hashes.length; i++)
        {
            hash = hashes[i].split('=');
            vars.push(hash[0]);
            vars[hash[0]] = hash[1];
        }
        return vars;
    }

    var source = getUrlVars()["lm_supplier"];
    var el = source.toString();
    var result= decodeURI(el);

console.log(result)

this function get what you want from the url, var source = getUrlVars()["put what you want to get from the url"];

    function gup() {
    var qs = document.location.search;
    qs = qs.split('+').join(' ');
    var params = {}, tokens, re = /[?&]?([^=]+)=([^&]*)/g;
    while (tokens = re.exec(qs))
        params[decodeURIComponent(tokens[1])] = decodeURIComponent(tokens[2]);
    return params;
}

use it like

var params = gup()

and then

params.param1
params.param2

As mentioned in the first answer in the latest browser we can use new URL api, However a more consistent native javascript easy solution to get all the params in an object and use them could be

For Example this class say locationUtil

const locationSearch = () => window.location.search;
const getParams = () => {
  const usefulSearch = locationSearch().replace('?', '');
  const params = {};
  usefulSearch.split('&').map(p => {
    const searchParam = p.split('=');
    const [key, value] = searchParam;
    params[key] = value;
    return params;
  });
  return params;
};

export const searchParams = getParams();

Usage :: Now you can import searchParams object in your class

for Example for url --- https://www.google.com?key1=https://www.linkedin.com/in/spiara/&valid=true

import { searchParams } from '../somewhere/locationUtil';

const {key1, valid} = searchParams;
if(valid) {
 console.log("Do Something");
 window.location.href = key1;
}

I tried a lot of different ways, but this tried and true regex function works for me when I am looking for param values in a URL, hope this helps:

        var text = 'www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5'

        function QueryString(item, text){
            var foundString = text.match(new RegExp("[\?\&]" + item + "=([^\&]*)(\&?)","i"));
            return foundString ? foundString[1] : foundString;
        }

        console.log(QueryString('c', text));

use like QueuryString('param_name', url) and will return the value

m2-m3-m4-m5

My solution:

/**
 * get object with params from query of url
 */
const getParams = (url) => {
  const params = {};
  const parser = document.createElement('a');
  parser.href = url;
  const query = parser.search.substring(1);
  if (query !== '') {
    const vars = query.split('&');
    for (let i = 0; i < vars.length; i++) {
      const pair = vars[i].split('=');
      const key = decodeURIComponent(pair[0]).replace('[]', '');
      const value = decodeURIComponent(pair[1]);
      
      if (key in params) {
        if (Array.isArray(params[key])) {
          params[key].push(value);
        } else {
          params[key] = [params[key]];
          params[key].push(value);
        }
      } else params[key] = value;
    }
  }
  return params;
}

I have had the same problem over and over again. Now many users here now I'm famous for my HAX work,

so I solve it by using:

PHP:

echo "<p style="display:none" id=\"hidden-GET\">".$_GET['id']."</p>";

JS:

document.getElementById("hidden-GET").innerHTML;

Simple HAX but working.