web-dev-qa-db-pt.com

Como obter o valor dos parâmetros GET?

Eu tenho um URL com alguns parâmetros GET da seguinte maneira:

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

Eu preciso obter todo o valor de c. Tentei ler o URL, mas só consegui m2. Como faço isso usando JavaScript?

1051
joe

JavaScript próprio não tem nada embutido para lidar com parâmetros de string de consulta. 

Código em execução em um navegador (moderno), você pode usar o objeto URL (que faz parte dos navegadores das APIs por navegadores para JS):

var url_string = "http://www.example.com/t.html?a=1&b=3&c=m2-m3-m4-m5"; //window.location.href
var url = new URL(url_string);
var c = url.searchParams.get("c");
console.log(c);


Para navegadores mais antigos (incluindo o Internet Explorer), você pode usar este polyfill ou o código da versão original desta resposta que antecede URL:

Você poderia acessar location.search, que lhe forneceria o caractere ? até o final da URL ou o início do identificador de fragmento (#foo), o que ocorrer primeiro.

Então você pode analisar isso:

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[0]);
    var value = decodeURIComponent(pair[1]);
    // If first entry with this name
    if (typeof query_string[key] === "undefined") {
      query_string[key] = decodeURIComponent(value);
      // If second entry with this name
    } else if (typeof query_string[key] === "string") {
      var arr = [query_string[key], decodeURIComponent(value)];
      query_string[key] = arr;
      // If third or later entry with this name
    } else {
      query_string[key].Push(decodeURIComponent(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);

Você pode obter a string de consulta do URL da página atual com:

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

A maioria das implementações que vi deixou de fora a decodificação de URL dos nomes e dos valores.

Aqui está uma função de utilidade geral que também faz decodificação de URL apropriada:

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);
235
Ates Goral

fonte

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')
212
Haim Evgi

Esta é uma maneira fácil de verificar apenas um parâmetro:

URL de exemplo:

    http://myserver/action?myParam=2

Exemplo de Javascript:

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

se "myParam" existir na variável URL ... myParam conterá "2", caso contrário, será indefinido.

Talvez você queira um valor padrão, nesse caso:

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

Atualização: Isso funciona melhor:

    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';

E funciona direito mesmo quando o URL está cheio de parâmetros.

178
mzalazar

Os fornecedores de navegadores implementaram uma maneira nativa de fazer isso via URL e URLSearchParams.

let url = new URL('http://www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5');
let searchParams = new URLSearchParams(url.search);
console.log(searchParams.get('c'));  // outputs "m2-m3-m4-m5"

Atualmente suportado no Firefox, Opera, Safari, Chrome e Edge. Para uma lista de suporte ao navegador veja aqui .

https://developer.mozilla.org/pt-BR/docs/Web/API/URLSearchParamshttps://developer.mozilla.org/pt-BR/docs/Web/ API/URL/URL

https://url.spec.whatwg.org/

Eric Bidelman, engenheiro do Google, recomenda usando este polyfill para navegadores não suportados.

101
cgatian

Você pode obter a string de consulta em location.search, então você pode dividir tudo após o ponto de interrogação:

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;
74
Blixt

Eu achei isso há muito tempo, muito fácil:

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

Então ligue assim:

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

Eu escrevi uma solução mais simples e elegante.

var arr = document.URL.match(/room=([0-9]+)/)
var room = arr[1];
36
nathanengineer

Aqui está uma solução recursiva que não tem regex, e tem mutação mínima (apenas o objeto params é mutado, o que eu acredito ser inevitável em JS).

É incrível porque:

  • É recursivo
  • Lida com vários parâmetros do mesmo nome
  • Trata bem com strings de parâmetros malformados (valores ausentes, etc.)
  • Não quebra se '=' está no valor
  • Executa a decodificação de URL
  • E por último, é incrível porque ... argh !!!

Código:

var get_params = function(search_string) {

  var parse = function(params, pairs) {
    var pair = pairs[0];
    var parts = pair.split('=');
    var key = decodeURIComponent(parts[0]);
    var value = decodeURIComponent(parts.slice(1).join('='));

    // Handle multiple parameters of the same name
    if (typeof params[key] === "undefined") {
      params[key] = value;
    } else {
      params[key] = [].concat(params[key], value);
    }

    return pairs.length == 1 ? params : parse(params, pairs.slice(1))
  }

  // Get rid of leading ?
  return search_string.length == 0 ? {} : parse({}, search_string.substr(1).split('&'));
}

var params = get_params(location.search);

// Finally, to get the param you want
params['c'];
28
Jai

Veja isso

function getURLParameters(paramName)
{
    var sURL = window.document.URL.toString();
    if (sURL.indexOf("?") > 0)
    {
        var arrParams = sURL.split("?");
        var arrURLParams = arrParams[1].split("&");
        var arrParamNames = new Array(arrURLParams.length);
        var arrParamValues = new Array(arrURLParams.length);

        var i = 0;
        for (i = 0; i<arrURLParams.length; i++)
        {
            var sParam =  arrURLParams[i].split("=");
            arrParamNames[i] = sParam[0];
            if (sParam[1] != "")
                arrParamValues[i] = unescape(sParam[1]);
            else
                arrParamValues[i] = "No Value";
        }

        for (i=0; i<arrURLParams.length; i++)
        {
            if (arrParamNames[i] == paramName)
            {
                //alert("Parameter:" + arrParamValues[i]);
                return arrParamValues[i];
            }
        }
        return "No Parameters Found";
    }
}
23
Dhiral Pandya

Uma maneira super simples usando URLSearchParams .

function getParam(param){
  return new URLSearchParams(window.location.search).get(param);
}

Atualmente, é suportado no Chrome, Firefox, Safari, Edge e outros .

21
spencer.sm

Solução ECMAScript 6:

var params = window.location.search
  .substring(1)
  .split("&")
  .map(v => v.split("="))
  .reduce((map, [key, value]) => map.set(key, decodeURIComponent(value)), new Map())
19
veiset

Eu fiz uma função que faz isso:

var getUrlParams = function (url) {
  var params = {};
  (url + '?').split('?')[1].split('&').forEach(function (pair) {
    pair = (pair + '=').split('=').map(decodeURIComponent);
    if (pair[0].length) {
      params[pair[0]] = pair[1];
    }
  });
  return params;
};

Atualização de 5/26/2017, aqui está uma implementação do ES7 (executada com o estágio predefinido 0, 1, 2 ou 3 do babel):

const getUrlParams = url => `${url}?`.split('?')[1]
  .split('&').reduce((params, pair) =>
    ((key, val) => key ? {...params, [key]: val} : params)
    (...`${pair}=`.split('=').map(decodeURIComponent)), {});

Alguns testes:

console.log(getUrlParams('https://google.com/foo?a=1&b=2&c')); // Will log {a: '1', b: '2', c: ''}
console.log(getUrlParams('/foo?a=1&b=2&c')); // Will log {a: '1', b: '2', c: ''}
console.log(getUrlParams('?a=1&b=2&c')); // Will log {a: '1', b: '2', c: ''}
console.log(getUrlParams('https://google.com/')); // Will log {}
console.log(getUrlParams('a=1&b=2&c')); // Will log {}

Atualização 26/03/2018, aqui está uma implementação do TypeScript:

const getUrlParams = (search: string) => `${search}?`
  .split('?')[1]
  .split('&')
  .reduce(
    (params: object, pair: string) => {
      const [key, value] = `${pair}=`
        .split('=')
        .map(decodeURIComponent)

      return key.length > 0 ? { ...params, [key]: value } : params
    },
    {}
  )

Atualização 2/13/2019, aqui está uma implementação atualizada do TypeScript que funciona com o TypeScript 3.

interface IParams { [key: string]: string }

const paramReducer = (params: IParams, pair: string): IParams => {
  const [key, value] = `${pair}=`.split('=').map(decodeURIComponent)

  return key.length > 0 ? { ...params, [key]: value } : params
}

const getUrlParams = (search: string): IParams =>
  `${search}?`.split('?')[1].split('&').reduce<IParams>(paramReducer, {})
15
Nate Ferrero

Eu uso a biblioteca parseUri . Ele permite que você faça exatamente o que você está pedindo:

var uri = 'www.test.com/t.html&a=1&b=3&c=m2-m3-m4-m5';
var c = uri.queryKey['c'];
// c = 'm2-m3-m4-m5'
11
Chris Dutrow

Eu uso

function getVal(str) {
    var v = window.location.search.match(new RegExp('(?:[\?\&]'+str+'=)([^&]+)'));
    return v ? v[1] : null;
}
10
Fancyoung

Aqui está a minha solução. Como aconselhado por Andy E ao responder esta pergunta , não é bom para o desempenho do seu script se ele está repetidamente construindo várias strings regex, executando loops etc apenas para obter um único valor. Então, eu criei um script mais simples que retorna todos os parâmetros GET em um único objeto. Você deve chamá-lo apenas uma vez, atribuir o resultado a uma variável e, em qualquer ponto no futuro, obter qualquer valor desejado dessa variável usando a chave apropriada. Observe que ele também cuida da decodificação de URI (ou seja, coisas como% 20) e substitui + por um espaço:

 function getUrlQueryParams(url) {
  var queryString = url.split("?")[1];
  var keyValuePairs = queryString.split("&");
  var keyValue = [];
  var queryParams = {};
  keyValuePairs.forEach(function(pair) {
    keyValue = pair.split("=");
    queryParams[keyValue[0]] = decodeURIComponent(keyValue[1]).replace(/\+/g, " ");
});
  return queryParams;
}

Então, aqui estão alguns testes do script para você ver:

// Query parameters with strings only, no special characters.
var currentParams = getUrlQueryParams("example.com/foo?number=zero");
alert(currentParams["number"]); // Gives "zero".

// For the URL you stated above...
var someParams = getUrlQueryParams("www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5 ");
alert(someParams["c"]); // Gives "m2-m3-m4-m5".

// For a query params with URI encoding...
var someParams = getUrlQueryParams("www.example.com/t.html?phrase=a%20long%20shot&location=Silicon+Valley%2C+USA");
alert(someParams["phrase"]); // Gives "a long shot".
alert(someParams["location"]); // Gives "Silicon Valley, USA".
9
Maviza101

Para Single Parameter Value como este index.html? Msg = 1 use o seguinte código,

$(window).load(function(){
    queryString();
});

function queryString()
{
    var queryString = window.location.search.substring(1);
    var varArray = queryString.split("="); //eg. index.html?msg=1

    var param1 = varArray[0];
    var param2 = varArray[1];

}

Para Todos os Parâmetros Valor use o seguinte Código,

$(window).load(function(){
    queryString();
});

function queryString()
{
    var queryString = window.location.search;
    var varArray = queryString.split("&");
    for (var i=0;i<varArray.length;i++) {
      var param = varArray[i].split("=");
        //parameter-value pair
    }
} 
8
Ravi Patel

essa pergunta tem muitas respostas, então estou adicionando outra.

/**
 * parses and returns URI query parameters 
 * 
 * @param {string} param parm
 * @param {bool?} asArray if true, returns an array instead of a scalar 
 * @returns {Object|Array} 
 */
function getURIParameter(param, asArray) {
    return document.location.search.substring(1).split('&').reduce(function(p,c) {
        var parts = c.split('=', 2).map(function(param) { return decodeURIComponent(param); });
        if(parts.length == 0 || parts[0] != param) return (p instanceof Array) && !asArray ? null : p;
        return asArray ? p.concat(parts.concat(true)[1]) : parts.concat(true)[1];
    }, []);
}

uso:

getURIParameter("id")  // returns the last id or null if not present
getURIParameter("id", true) // returns an array of all ids

isso lida com os parâmetros vazios (as chaves presentes sem "=value"), a exposição de uma API de recuperação de valores escalar e baseada em array, bem como a decodificação adequada do componente URI.

7
Tyson

Aqui estou postando um exemplo. Mas é em jQuery. Espero que ajude os outros:

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.url.js"></script>

<!-- URL:  www.example.com/correct/?message=done&year=1990-->

<script type="text/javascript">
$(function(){
    $.url.attr('protocol')  // --> Protocol: "http"
    $.url.attr('path')          // --> Host: "www.example.com"
    $.url.attr('query')         // --> path: "/correct/"
    $.url.attr('message')   // --> query: "done"
    $.url.attr('year')      // --> query: "1990"
});
</script>
7
Sariban D'Cl

Ou se você não quiser reinventar a roda de análise de URI use URI.js

Para obter o valor de um parâmetro chamado foo:

new URI((''+document.location)).search(true).foo

O que isso faz é 

  1. Converte document.location para uma string (é um objeto) 
  2. Alimente essa cadeia ao construtor de classe URI do URI.js
  3. Invoque a função search () para obter a parte de pesquisa (consulta) do URL
    (a passagem true diz para a saída de um objeto)
  4. Acesse a propriedade foo no objeto resultante para obter o valor

Aqui está um violino para isso .... http://jsfiddle.net/m6tett01/12/

7
Gus

Maneira simples

function getParams(url){
        var regex = /[?&]([^=#]+)=([^&#]*)/g,
            params = {},
            match;
        while(match = regex.exec(url)) {
            params[match[1]] = match[2];
        }
        return params;
    }

então chame como getParams (url)

6
Sudhakar Reddy
// Read a page's GET URL variables and return them as an associative array.
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;
}

// Usage for URL: http://my.site.com/location?locationId=53cc272c0364aefcb78756cd&shared=false
var id = getUrlVars()["locationId"];

Tenho aqui: http://jquery-howto.blogspot.ru/2009/09/get-url-parameters-values-with-jquery.html

6
thezar
// http:localhost:8080/path?param_1=a&param_2=b
var getParamsMap = function () {
    var params = window.location.search.split("&");
    var paramsMap = {};
    params.forEach(function (p) {
        var v = p.split("=");
        paramsMap[v[0]]=decodeURIComponent(v[1]);
    });
    return paramsMap;
};

// -----------------------

console.log(getParamsMap()["param_1"]);  // should log "a"     
5
Wolf7176

Mais uma sugestão. 

Já existem algumas boas respostas, mas achei desnecessariamente complexas e difíceis de entender. Isso é curto, simples e retorna um array associativo simples com nomes de chave correspondentes aos nomes dos tokens no URL. 

Eu adicionei uma versão com comentários abaixo para aqueles que querem aprender.

Observe que isso depende de jQuery ($ .each) para seu loop, que eu recomendo em vez de forEach. Acho mais simples garantir compatibilidade entre navegadores usando jQuery em vez de conectar correções individuais para suportar as novas funções que não são suportadas em navegadores mais antigos.

Edit: Depois que eu escrevi isso, notei a resposta de Eric Elliott, que é quase o mesmo, embora use para Eee, enquanto eu geralmente sou contra (por razões citadas acima).

function getTokens(){
    var tokens = [];
    var query = location.search;
    query = query.slice(1);
    query = query.split('&');
    $.each(query, function(i,value){    
        var token = value.split('=');   
        var key = decodeURIComponent(token[0]);     
        var data = decodeURIComponent(token[1]);
        tokens[key] = data;
    });
    return tokens;
}

Versão comentada: 

function getTokens(){
    var tokens = [];            // new array to hold result
    var query = location.search; // everything from the '?' onward 
    query = query.slice(1);     // remove the first character, which will be the '?' 
    query = query.split('&');   // split via each '&', leaving us an array of something=something strings

    // iterate through each something=something string
    $.each(query, function(i,value){    

        // split the something=something string via '=', creating an array containing the token name and data
        var token = value.split('=');   

        // assign the first array element (the token name) to the 'key' variable
        var key = decodeURIComponent(token[0]);     

        // assign the second array element (the token data) to the 'data' variable
        var data = decodeURIComponent(token[1]);

        tokens[key] = data;     // add an associative key/data pair to our result array, with key names being the URI token names
    });

    return tokens;  // return the array
}

Para os exemplos abaixo, vamos assumir este endereço:

http://www.example.com/page.htm?id=4&name=murray

Você pode atribuir os tokens de URL à sua própria variável:

var tokens = getTokens();

Em seguida, consulte cada token de URL por nome como este:

document.write( tokens['id'] );

Isso imprimiria "4".

Você também pode simplesmente referir-se a um nome de token da função diretamente:

document.write( getTokens()['name'] );

... o que imprimiria "murray".

5
equazcion

Aqui está o angularJs código-fonte para analisar parâmetros de consulta de URL em um objeto:

function tryDecodeURIComponent(value) {
  try {
    return decodeURIComponent(value);
  } catch (e) {
    // Ignore any invalid uri component
  }
}

function isDefined(value) {return typeof value !== 'undefined';}

function parseKeyValue(keyValue) {
  keyValue = keyValue.replace(/^\?/, '');
  var obj = {}, key_value, key;
  var iter = (keyValue || "").split('&');
  for (var i=0; i<iter.length; i++) {
    var kValue = iter[i];
    if (kValue) {
      key_value = kValue.replace(/\+/g,'%20').split('=');
      key = tryDecodeURIComponent(key_value[0]);
      if (isDefined(key)) {
        var val = isDefined(key_value[1]) ? tryDecodeURIComponent(key_value[1]) : true;
        if (!hasOwnProperty.call(obj, key)) {
          obj[key] = val;
        } else if (isArray(obj[key])) {
          obj[key].Push(val);
        } else {
          obj[key] = [obj[key],val];
        }
      }
    }
  };
  return obj;
}

alert(JSON.stringify(parseKeyValue('?a=1&b=3&c=m2-m3-m4-m5')));

Você pode adicionar esta função a window.location:

window.location.query = function query(arg){
  q = parseKeyValue(this.search);
  if (!isDefined(arg)) {
    return q;
  }      
  if (q.hasOwnProperty(arg)) {
    return q[arg];
  } else {
    return "";
  }
}

// assuming you have this url :
// http://www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5

console.log(window.location.query())

// Object {a: "1", b: "3", c: "m2-m3-m4-m5"}

console.log(window.location.query('c'))

// "m2-m3-m4-m5"
4
Charlesthk

Eu tive a necessidade de ler uma variável URL GET e concluir uma ação com base no parâmetro url. Eu procurei alto e baixo por uma solução e me deparei com este pequeno pedaço de código. Ele basicamente lê o URL da página atual, executa alguma expressão regular no URL e salva os parâmetros do URL em um array associativo, que podemos acessar facilmente.

Então, como um exemplo, se tivéssemos o seguinte url com o javascript na parte inferior no lugar.

http://TestServer/Pages/NewsArchive.aspx?year=2013&Month=July

Tudo o que precisamos fazer para obter o ID e a página dos parâmetros são:

O código será:

<script type="text/javascript">
var first = getUrlVars()["year"];
var second = getUrlVars()["Month"];

alert(first);
alert(second);
function getUrlVars() {
var vars = {};
var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
vars[key] = value;
});
return vars;
}
</script>
4
Waseem Khan
window.location.href.split("?")

em seguida, desconsidere o primeiro índice

Array.prototype.slice.call(window.location.href.split("?"), 1) 

retorna uma matriz dos seus parâmetros de URL

var paramArray = Array.prototype.slice.call(window.location.href.split(/[?=]+/), 1);
var paramObject = paramArray.reduce(function(x, y, i, a){ (i%2==0) ?  (x[y] = a[i+1]) : void 0; return x; }, {});

Um pouco mais detalhado/hacky mas também funcional, paramObject contém todos os parâmetros mapeados como um objeto js

3
thoggy

Podemos obter os valores de parâmetro c de uma forma mais simples sem fazer o loop de todos os parâmetros, veja o jQuery abaixo para obter os parâmetros.

1. Para obter o valor do parâmetro:

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=',"")

(ou)

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

retorna como uma string

"m2-m3-m4-m5"

2. Para substituir o valor do parâmetro:

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"**)
3
Syed Shahjahan
function getParamValue(param) {
    var urlParamString = location.search.split(param + "=");
    if (urlParamString.length <= 1) return "";
    else {
        var tmp = urlParamString[1].split("&");
        return tmp[0];
    }
}

Isso deve funcionar para o seu caso, não importa se o parâmetro é o último ou não.

3
Qiang

Aqui está o que eu faço:

var uriParams = getSearchParameters();
alert(uriParams.c);


// background functions:

// Get object/associative array of URL parameters
function getSearchParameters () {
  var prmstr = window.location.search.substr(1);
  return prmstr !== null && prmstr !== "" ? transformToAssocArray(prmstr) : {};
}

// convert parameters from url-style string to associative array
function transformToAssocArray (prmstr) {
  var params = {},
      prmarr = prmstr.split("&");

  for (var i = 0; i < prmarr.length; i++) {
    var tmparr = prmarr[i].split("=");
    params[tmparr[0]] = tmparr[1];
  }
  return params;
}
3
Bobb Fwed

O caminho mais curto:

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

This Gist de Eldon McGuinness é de longe a implementação mais completa de um analisador de string de consulta JavaScript que eu vi até agora.

Infelizmente, está escrito como um plugin jQuery.

Eu reescrevi para o Vanilla JS e fiz algumas melhorias:

function parseQuery(str) {
  var qso = {};
  var qs = (str || document.location.search);
  // Check for an empty querystring
  if (qs == "") {
    return qso;
  }
  // Normalize the querystring
  qs = qs.replace(/(^\?)/, '').replace(/;/g, '&');
  while (qs.indexOf("&&") != -1) {
    qs = qs.replace(/&&/g, '&');
  }
  qs = qs.replace(/([\&]+$)/, '');
  // Break the querystring into parts
  qs = qs.split("&");
  // Build the querystring object
  for (var i = 0; i < qs.length; i++) {
    var qi = qs[i].split("=");
    qi = qi.map(function(n) {
      return decodeURIComponent(n)
    });
    if (typeof qi[1] === "undefined") {
      qi[1] = null;
    }
    if (typeof qso[qi[0]] !== "undefined") {

      // If a key already exists then make this an object
      if (typeof (qso[qi[0]]) == "string") {
        var temp = qso[qi[0]];
        if (qi[1] == "") {
          qi[1] = null;
        }
        qso[qi[0]] = [];
        qso[qi[0]].Push(temp);
        qso[qi[0]].Push(qi[1]);

      } else if (typeof (qso[qi[0]]) == "object") {
        if (qi[1] == "") {
          qi[1] = null;
        }
        qso[qi[0]].Push(qi[1]);
      }
    } else {
      // If no key exists just set it as a string
      if (qi[1] == "") {
        qi[1] = null;
      }
      qso[qi[0]] = qi[1];
    }
  }
  return qso;
}

// DEMO
console.log(parseQuery("?foo=bar&foo=boo&roo=bar;bee=bop;=ghost;=ghost2;&;checkbox%5B%5D=b1;checkbox%5B%5D=b2;dd=;http=http%3A%2F%2Fw3schools.com%2Fmy%20test.asp%3Fname%3Dst%C3%A5le%26car%3Dsaab&http=http%3A%2F%2Fw3schools2.com%2Fmy%20test.asp%3Fname%3Dst%C3%A5le%26car%3Dsaab"));

Veja também this Fiddle .

3
John Slegers

Use o dojo. Nenhuma outra solução aqui é tão curta ou tão bem testada:

require(["dojo/io-query"], function(ioQuery){
    var uri = "www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5 ";
    var query = uri.substring(uri.indexOf("?") + 1, uri.length);
    var queryObject = ioQuery.queryToObject(query);
    console.log(queryObject.c); //prints m2-m3-m4-m5
});
2
user64141

PHP parse_str copycat .. :)

// Handles also array params well
function parseQueryString(query) {
    var pars = (query != null ? query : "").replace(/&+/g, "&").split('&'),
        par, key, val, re = /^([\w]+)\[(.*)\]/i, ra, ks, ki, i = 0,
        params = {};

    while ((par = pars.shift()) && (par = par.split('=', 2))) {
        key = decodeURIComponent(par[0]);
        // prevent param value going to be "undefined" as string
        val = decodeURIComponent(par[1] || "").replace(/\+/g, " ");
        // check array params
        if (ra = re.exec(key)) {
            ks = ra[1];
            // init array param
            if (!(ks in params)) {
                params[ks] = {};
            }
            // set int key
            ki = (ra[2] != "") ? ra[2] : i++;
            // set array param
            params[ks][ki] = val;
            // go on..
            continue;
        }
        // set param
        params[key] = val;
    }

    return params;
}

var query = 'foo=1&bar=The+bar!%20&arr[]=a0&arr[]=a1&arr[s]=as&isset&arr[]=last';
var params = parseQueryString(query);
console.log(params)
console.log(params.foo)        // 1
console.log(params.bar)        // The bar!
console.log(params.arr[0])     // a0
console.log(params.arr[1])     // a1
console.log(params.arr.s)      // as
console.log(params.arr.none)   // undefined
console.log("isset" in params) // true like: isset($_GET['isset'])



/*
// in php
parse_str('foo=1&bar=The+bar!%20&arr[]=a0&arr[]=a1&arr[s]=as&isset&arr[]=last', $query);
print_r($query);

Array
(
    [foo] => 1
    [bar] => The bar!
    [arr] => Array
        (
            [0] => a0
            [1] => a1
            [s] => as
            [2] => last
        )

    [isset] =>
)*/
2
K-Gun

Você pode adicionar uma caixa de entrada e pedir ao usuário para copiar o valor para ela ... é muito fácil assim:

<h1>Hey User! Can you please copy the value out of the location bar where it says like, &m=2? Thanks! And then, if you could...paste it in the box below and click the Done button?</h1>
<input type='text' id='the-url-value' />
<input type='button' value='This is the Done button. Click here after you do all that other stuff I wrote.' />

<script>
//...read the value on click

Ok, falando sério ... Eu encontrei este código e parece funcionar bem:

http://www.developerdrive.com/2013/08/turning-the-querystring-into-a-json-object-using-javascript/

function queryToJSON() {
    var pairs = location.search.slice(1).split('&');

    var result = {};
    pairs.forEach(function(pair) {
        pair = pair.split('=');
        result[pair[0]] = decodeURIComponent(pair[1] || '');
    });

    return JSON.parse(JSON.stringify(result));
}

var query = queryToJSON();
2
Timmerz

Para extrair todos os parâmetros de URL do objeto de pesquisa em window.location como 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"}
1
Bills

Eu gosto de escrever taquigrafia o máximo possível:

URL: example.com/mortgage_calc.htm?pmts=120&intr=6.8&prin=10000

Baunilha Javascript:

for ( var vObj = {}, i=0, vArr = window.location.search.substring(1).split('&');
        i < vArr.length; v = vArr[i++].split('='), vObj[v[0]] = v[1] ){}
// vObj = {pmts: "120", intr: "6.8", prin: "10000"}
1
Phil Tune

Eu desenvolvi uma ferramenta JavaScript para fazer isso em um simples passo

Primeiro, copie esse link de script para o cabeçalho do seu HTML:

<script src="https://booligoosh.github.io/urlParams/urlParams.js"></script>

Então, basta obter o valor de c usando urlParams.c ou urlParams['c']. Simples!

Você pode ver uma demonstração real usando seus valores aqui.

Também tenha em mente que eu desenvolvi isso, mas é uma solução fácil e despreocupada para o seu problema. Essa ferramenta também inclui a decodificação de caracteres hexadecimais, que geralmente pode ser útil.

0
Ethan

Aqui está uma solução que eu acho um pouco mais legível - mas vai exigir um shiff .forEach() para <IE8:

var getParams = function () {
  var params = {};
  if (location.search) {
    var parts = location.search.slice(1).split('&');

    parts.forEach(function (part) {
      var pair = part.split('=');
      pair[0] = decodeURIComponent(pair[0]);
      pair[1] = decodeURIComponent(pair[1]);
      params[pair[0]] = (pair[1] !== 'undefined') ?
        pair[1] : true;
    });
  }
  return params;
}
0
Eric Elliott

Aqui está a minha solução: jsfiddle

O método abaixo retorna um dicionário contendo os parâmetros do URL fornecido. Caso não haja parâmetros, será nulo.

function getParams(url){
    var paramsStart = url.indexOf('?');
    var params = null;

    //no params available
    if(paramsStart != -1){
        var paramsString = url.substring(url.indexOf('?') + 1, url.length);

        //only '?' available
        if(paramsString != ""){
            var paramsPairs = paramsString.split('&');

            //preparing
            params = {};
            var empty = true;
            var index  = 0;
            var key = "";
            var val = "";

            for(i = 0, len = paramsPairs.length; i < len; i++){
                index = paramsPairs[i].indexOf('=');

                //if assignment symbol found
                if(index != -1){
                    key = paramsPairs[i].substring(0, index);
                    val = paramsPairs[i].substring(index + 1, paramsPairs[i].length);

                    if(key != "" && val != ""){

                        //extend here for decoding, integer parsing, whatever...

                        params[key] = val;

                        if(empty){
                            empty = false;
                        }
                    }                    
                }
            }

            if(empty){
                params = null;
            }
        }
    }

    return params;
}
0
jns

Aprendendo com muitas respostas (como VaMoose 's, Gnarf ' s ou Blixt 's).

Você pode criar um objeto (ou usar o objeto Location) e adicionar um método que permita obter os parâmetros de URL, decodificados e com estilo JS:

Url = {
    params: undefined,
    get get(){
        if(!this.params){
            var vars = {};
            if(url.length!==0)
                url.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value){
                    key=decodeURIComponent(key);
                    if(typeof vars[key]==="undefined") {
                        vars[key]= decodeURIComponent(value);
                    }
                    else {
                        vars[key]= [].concat(vars[key], decodeURIComponent(value));
                    }
                });
            this.params = vars;
        }
        return this.params;
    }
};

Isso permite que o método seja chamado usando Url.get.

A primeira vez que ele irá buscar o objeto a partir do URL, as próximas vezes ele irá carregar os salvos.

Exemplo

Em um URL como ?param1=param1Value&param2=param2Value&param1=param1Value2, os parâmetros podem ser buscados como:

Url.get.param1 //["param1Value","param1Value2"]
Url.get.param2 //"param2Value"
0
Gatsbimantico