¿Hay alguna forma sin complemento de recuperar la cadena de consulta valores de través de jQuery (o sin)?

¿Si es así, cómo? Si no, ¿hay un complemento que pueda hacerlo?

Actualización: Sep-2018

Puede usar URLSearchParams, que es simple y tiene un soporte de navegador decente (pero no completo) .

const urlParams = new URLSearchParams(window.location.search);
const myParam = urlParams.get('myParam');

Original

No necesitas jQuery para ese propósito. Puede usar solo JavaScript puro:

function getParameterByName(name, url) {
    if (!url) url = window.location.href;
    name = name.replace(/[\[\]]/g, '\\$&');
    var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'),
        results = regex.exec(url);
    if (!results) return null;
    if (!results[2]) return '';
    return decodeURIComponent(results[2].replace(/\+/g, ' '));
}

Uso:

// query string: ?foo=lorem&bar=&baz
var foo = getParameterByName('foo'); // "lorem"
var bar = getParameterByName('bar'); // "" (present with empty value)
var baz = getParameterByName('baz'); // "" (present with no value)
var qux = getParameterByName('qux'); // null (absent)

Nota: Si un parámetro está presente varias veces ( ?foo=lorem&foo=ipsum), obtendrá el primer valor ( lorem). No hay un estándar sobre esto y los usos varían, consulte, por ejemplo, esta pregunta: Posición autorizada de claves de consulta HTTP GET duplicadas .
NOTA: La función distingue entre mayúsculas y minúsculas. Si prefiere el nombre del parámetro que no distingue entre mayúsculas y minúsculas, agregue el modificador 'i' a RegExp

Esta es una actualización basada en las nuevas especificaciones URLSearchParams para lograr el mismo resultado de manera más sucinta. Consulte la respuesta titulada " URLSearchParams " a continuación.

Algunas de las soluciones publicadas aquí son ineficientes. Repetir la búsqueda de expresiones regulares cada vez que el script necesita acceder a un parámetro es completamente innecesario, una sola función para dividir los parámetros en un objeto de estilo de matriz asociativa es suficiente. Si no está trabajando con la API de historial de HTML 5, esto solo es necesario una vez por carga de página. Las otras sugerencias aquí también fallan al decodificar la URL correctamente.

var urlParams;
(window.onpopstate = function () {
    var match,
        pl     = /\+/g,  // Regex for replacing addition symbol with a space
        search = /([^&=]+)=?([^&]*)/g,
        decode = function (s) { return decodeURIComponent(s.replace(pl, " ")); },
        query  = window.location.search.substring(1);

    urlParams = {};
    while (match = search.exec(query))
       urlParams[decode(match[1])] = decode(match[2]);
})();

Ejemplo de cadena de consulta:

?i=main&mode=front&sid=de8d49b78a85a322c4155015fdce22c4&enc=+Hello%20&empty

Resultado:

 urlParams = {
    enc: " Hello ",
    i: "main",
    mode: "front",
    sid: "de8d49b78a85a322c4155015fdce22c4",
    empty: ""
}

alert(urlParams["mode"]);
// -> "front"

alert("empty" in urlParams);
// -> true

Esto podría mejorarse fácilmente para manejar cadenas de consulta de estilo matriz también. Aquí hay un ejemplo de esto , pero como los parámetros de estilo de matriz no están definidos en RFC 3986 , no contaminaré esta respuesta con el código fuente.Para aquellos interesados ​​en una versión "contaminada", mire la respuesta de Campbeln a continuación .

Además, como se señala en los comentarios, ;es un delimitador legal para key=valuepares. Se requeriría una expresión regular más complicada para manejar ;o &, lo que creo que es innecesario porque es raro que ;se use y diría que es aún más improbable que se usen ambos. Si necesita soporte en ;lugar de &, simplemente cámbielos en la expresión regular.

<script>var urlParams = <?php echo json_encode($_GET, JSON_HEX_TAG);?>;</script>

Mucho más simple!

ACTUALIZADO

Una nueva capacidad sería recuperar parámetros repetidos de la siguiente manera myparam=1&myparam=2. No hay una especificación , sin embargo, la mayoría de los enfoques actuales siguen a la generación de una matriz.

myparam = ["1", "2"]

Entonces, este es el enfoque para administrarlo:

let urlParams = {};
(window.onpopstate = function () {
    let match,
        pl = /\+/g,  // Regex for replacing addition symbol with a space
        search = /([^&=]+)=?([^&]*)/g,
        decode = function (s) {
            return decodeURIComponent(s.replace(pl, " "));
        },
        query = window.location.search.substring(1);

    while (match = search.exec(query)) {
        if (decode(match[1]) in urlParams) {
            if (!Array.isArray(urlParams[decode(match[1])])) {
                urlParams[decode(match[1])] = [urlParams[decode(match[1])]];
            }
            urlParams[decode(match[1])].push(decode(match[2]));
        } else {
            urlParams[decode(match[1])] = decode(match[2]);
        }
    }
})();

ES2015 (ES6)

getQueryStringParams = query => {
    return query
        ? (/^[?#]/.test(query) ? query.slice(1) : query)
            .split('&')
            .reduce((params, param) => {
                    let [key, value] = param.split('=');
                    params[key] = value ? decodeURIComponent(value.replace(/\+/g, ' ')) : '';
                    return params;
                }, {}
            )
        : {}
};

Sin jQuery

var qs = (function(a) {
    if (a == "") return {};
    var b = {};
    for (var i = 0; i < a.length; ++i)
    {
        var p=a[i].split('=', 2);
        if (p.length == 1)
            b[p[0]] = "";
        else
            b[p[0]] = decodeURIComponent(p[1].replace(/\+/g, " "));
    }
    return b;
})(window.location.search.substr(1).split('&'));

Con una URL como ?topic=123&name=query+string, volverá lo siguiente:

qs["topic"];    // 123
qs["name"];     // query string
qs["nothere"];  // undefined (object)

Método de Google

Al romper el código de Google, encontré el método que usan: getUrlParameters

function (b) {
    var c = typeof b === "undefined";
    if (a !== h && c) return a;
    for (var d = {}, b = b || k[B][vb], e = b[p]("?"), f = b[p]("#"), b = (f === -1 ? b[Ya](e + 1) : [b[Ya](e + 1, f - e - 1), "&", b[Ya](f + 1)][K](""))[z]("&"), e = i.dd ? ia : unescape, f = 0, g = b[w]; f < g; ++f) {
        var l = b[f][p]("=");
        if (l !== -1) {
            var q = b[f][I](0, l),
                l = b[f][I](l + 1),
                l = l[Ca](/\+/g, " ");
            try {
                d[q] = e(l)
            } catch (A) {}
        }
    }
    c && (a = d);
    return d
}

Está ofuscado, pero es comprensible. No funciona porque algunas variables no están definidas.

Comienzan a buscar parámetros en la url desde ?y también desde el hash #. Luego, para cada parámetro, se dividen en el signo igual b[f][p]("=")(que parece indexOf, usan la posición del carácter para obtener la clave / valor). Al dividirlo, comprueban si el parámetro tiene un valor o no, si lo tiene, almacenan el valor d, de lo contrario simplemente continúan.

Al final dse devuelve el objeto , manejando el escape y el +signo. Este objeto es como el mío, tiene el mismo comportamiento.

Mi método como un complemento jQuery

(function($) {
    $.QueryString = (function(paramsArray) {
        let params = {};

        for (let i = 0; i < paramsArray.length; ++i)
        {
            let param = paramsArray[i]
                .split('=', 2);

            if (param.length !== 2)
                continue;

            params[param[0]] = decodeURIComponent(param[1].replace(/\+/g, " "));
        }

        return params;
    })(window.location.search.substr(1).split('&'))
})(jQuery);

Uso

//Get a param
$.QueryString.param
//-or-
$.QueryString["param"]
//This outputs something like...
//"val"

//Get all params as object
$.QueryString
//This outputs something like...
//Object { param: "val", param2: "val" }

//Set a param (only in the $.QueryString object, doesn't affect the browser's querystring)
$.QueryString.param = "newvalue"
//This doesn't output anything, it just updates the $.QueryString object

//Convert object into string suitable for url a querystring (Requires jQuery)
$.param($.QueryString)
//This outputs something like...
//"param=newvalue&param2=val"

//Update the url/querystring in the browser's location bar with the $.QueryString object
history.replaceState({}, '', "?" + $.param($.QueryString));
//-or-
history.pushState({}, '', "?" + $.param($.QueryString));

Prueba de rendimiento (método dividido contra método regex) ( jsPerf )

Código de preparación: declaración de métodos

Código de prueba dividido

var qs = window.GetQueryString(query);

var search = qs["q"];
var value = qs["value"];
var undef = qs["undefinedstring"];

Código de prueba Regex

var search = window.getParameterByName("q");
var value = window.getParameterByName("value");
var undef = window.getParameterByName("undefinedstring");

Prueba en Firefox 4.0 x86 en Windows Server 2008 R2 / 7 x64

• Método de división : 144,780 ± 2.17% más rápido
• Método Regex : 13,891 ± 0.85% | 90% más lento

Versión mejorada de la respuesta de Artem Barger :

function getParameterByName(name) {
    var match = RegExp('[?&]' + name + '=([^&]*)').exec(window.location.search);
    return match && decodeURIComponent(match[1].replace(/\+/g, ' '));
}

Para obtener más información sobre mejoras, consulte: http://james.padolsey.com/javascript/bujs-1-getparameterbyname/

URLSearchParams

Firefox 44+, Opera 36+, Edge 17+, Safari 10.3+ y Chrome 49+ admiten la API URLSearchParams :

• Anuncio y detalles de Chrome
• Anuncio de Opera y detalles
• Anuncio de Firefox y detalles

Hay un polyfill URLSearchParams sugerido por Google para las versiones estables de IE.

No está estandarizado por W3C , pero es un estándar de vida de WhatWG .

Puedes usarlo en location:

let params = new URLSearchParams(location.search);

o

let params = (new URL(location)).searchParams;

O, por supuesto, en cualquier URL:

let url = new URL('https://example.com?foo=1&bar=2');
let params = new URLSearchParams(url.search);

También puede obtener parámetros utilizando una .searchParamspropiedad abreviada en el objeto URL, como esta:

let params = new URL('https://example.com?foo=1&bar=2').searchParams;
params.get('foo'); // "1"
params.get('bar'); // "2" 

Uno lee / parámetros establecidos a través de la get(KEY), set(KEY, VALUE), append(KEY, VALUE)API. También puedes iterar sobre todos los valoresfor (let p of params) {} .

Una implementación de referencia y una página de muestra están disponibles para auditoría y pruebas.

Solo otra recomendación. El complemento Purl permite recuperar todas las partes de la URL, incluido el ancla, el host, etc.

Se puede usar con o sin jQuery.

El uso es muy simple y genial:

var url = $.url('http://allmarkedup.com/folder/dir/index.html?item=value'); // jQuery version
var url = purl('http://allmarkedup.com/folder/dir/index.html?item=value'); // plain JS version
url.attr('protocol'); // returns 'http'
url.attr('path'); // returns '/folder/dir/index.html'

Sin embargo, a partir del 11 de noviembre de 2014, Purl ya no se mantiene y el autor recomienda usar URI.js en su lugar. El complemento jQuery es diferente porque se enfoca en elementos: para usar con cadenas, solo use URIdirectamente, con o sin jQuery. Un código similar se vería como tal, documentos más completos aquí :

var url = new URI('http://allmarkedup.com/folder/dir/index.html?item=value'); // plain JS version
url.protocol(); // returns 'http'
url.path(); // returns '/folder/dir/index.html'

tl; dr

Una solución rápida y completa , que maneja claves multivalor y caracteres codificados .

var qd = {};
if (location.search) location.search.substr(1).split("&").forEach(function(item) {var s = item.split("="), k = s[0], v = s[1] && decodeURIComponent(s[1]); (qd[k] = qd[k] || []).push(v)})

//using ES6   (23 characters cooler)
var qd = {};
if (location.search) location.search.substr(1).split`&`.forEach(item => {let [k,v] = item.split`=`; v = v && decodeURIComponent(v); (qd[k] = qd[k] || []).push(v)})

var qd = {};
if (location.search) location.search.substr(1).split("&").forEach(function(item) {
    var s = item.split("="),
        k = s[0],
        v = s[1] && decodeURIComponent(s[1]); //  null-coalescing / short-circuit
    //(k in qd) ? qd[k].push(v) : qd[k] = [v]
    (qd[k] = qd[k] || []).push(v) // null-coalescing / short-circuit
})

¿Qué es todo este código ...
"fusión nula" , evaluación de cortocircuito
ES6 Destrucción de asignaciones , funciones de flecha , cadenas de plantillas

"?a=1&b=0&c=3&d&e&a=5&a=t%20e%20x%20t&e=http%3A%2F%2Fw3schools.com%2Fmy%20test.asp%3Fname%3Dståle%26car%3Dsaab"
> qd
a: ["1", "5", "t e x t"]
b: ["0"]
c: ["3"]
d: [undefined]
e: [undefined, "http://w3schools.com/my test.asp?name=ståle&car=saab"]

> qd.a[1]    // "5"
> qd["a"][1] // "5"

Leer más ... sobre la solución JavaScript de Vanilla.

Para acceder a diferentes partes de una URL use location.(search|hash)

La solución más fácil (ficticia)

var queryDict = {};
location.search.substr(1).split("&").forEach(function(item) {queryDict[item.split("=")[0]] = item.split("=")[1]})

• Maneja las llaves vacías correctamente.
• Invalida las teclas múltiples con el último valor encontrado.

"?a=1&b=0&c=3&d&e&a=5"
> queryDict
a: "5"
b: "0"
c: "3"
d: undefined
e: undefined

Claves de valores múltiples

Verificación simple de teclas (item in dict) ? dict.item.push(val) : dict.item = [val]

var qd = {};
location.search.substr(1).split("&").forEach(function(item) {(item.split("=")[0] in qd) ? qd[item.split("=")[0]].push(item.split("=")[1]) : qd[item.split("=")[0]] = [item.split("=")[1]]})

• Ahora devuelve matrices en su lugar.
• Acceda a valores por qd.key[index]oqd[key][index]

> qd
a: ["1", "5"]
b: ["0"]
c: ["3"]
d: [undefined]
e: [undefined]

Personajes codificados?

Úselo decodeURIComponent()para la segunda o ambas divisiones.

var qd = {};
location.search.substr(1).split("&").forEach(function(item) {var k = item.split("=")[0], v = decodeURIComponent(item.split("=")[1]); (k in qd) ? qd[k].push(v) : qd[k] = [v]})

"?a=1&b=0&c=3&d&e&a=5&a=t%20e%20x%20t&e=http%3A%2F%2Fw3schools.com%2Fmy%20test.asp%3Fname%3Dståle%26car%3Dsaab"
> qd
a: ["1", "5", "t e x t"]
b: ["0"]
c: ["3"]
d: ["undefined"]  // decodeURIComponent(undefined) returns "undefined" !!!*
e: ["undefined", "http://w3schools.com/my test.asp?name=ståle&car=saab"]

De comentarios

* !!! Tenga en cuenta que eso decodeURIComponent(undefined)devuelve una cadena "undefined". La solución radica en un uso simple de &&, que garantiza que decodeURIComponent()no se invoque en valores indefinidos. (Consulte la "solución completa" en la parte superior).

v = v && decodeURIComponent(v);

Si la cadena de consulta está vacía ( location.search == ""), el resultado es algo engañoso qd == {"": undefined}. Se sugiere verificar la cadena de consulta antes de iniciar la función de análisis likeso:

if (location.search) location.search.substr(1).split("&").forEach(...)

Roshambo en snipplr.com tiene un script simple para lograr esto descrito en Obtener parámetros de URL con jQuery | Mejora . Con su script, también puede extraer fácilmente los parámetros que desee.

Aquí está la esencia:

$.urlParam = function(name, url) {
    if (!url) {
     url = window.location.href;
    }
    var results = new RegExp('[\\?&]' + name + '=([^&#]*)').exec(url);
    if (!results) { 
        return undefined;
    }
    return results[1] || undefined;
}

Luego solo obtenga sus parámetros de la cadena de consulta.

Entonces, si la cadena URL / consulta era xyz.com/index.html?lang=de.

Solo llama var langval = $.urlParam('lang');, y lo tienes.

UZBEKJON también tiene una gran publicación de blog sobre esto, obtenga parámetros y valores de URL con jQuery .

Si está usando jQuery, puede usar una biblioteca, como jQuery BBQ: Botón de retroceso y Biblioteca de consultas .

... jQuery BBQ proporciona un .deparam()método completo , junto con la gestión de estado hash y los métodos de utilidad de análisis / fusión de cadenas de fragmentos / consultas.

Editar: Agregar Deparam Ejemplo:

 var DeparamExample = function() {
            var params = $.deparam.querystring();

            //nameofparam is the name of a param from url
            //code below will get param if ajax refresh with hash
            if (typeof params.nameofparam == 'undefined') {
                params = jQuery.deparam.fragment(window.location.href);
            }
            
            if (typeof params.nameofparam != 'undefined') {
                var paramValue = params.nameofparam.toString();
                  
            }
        };

Si solo quieres usar JavaScript simple, puedes usar ...

var getParamValue = (function() {
    var params;
    var resetParams = function() {
            var query = window.location.search;
            var regex = /[?&;](.+?)=([^&;]+)/g;
            var match;

            params = {};

            if (query) {
                while (match = regex.exec(query)) {
                    params[match[1]] = decodeURIComponent(match[2]);
                }
            }    
        };

    window.addEventListener
    && window.addEventListener('popstate', resetParams);

    resetParams();

    return function(param) {
        return params.hasOwnProperty(param) ? params[param] : null;
    }

})();​

Debido a la nueva API Historia de HTML y, específicamente, history.pushState()y history.replaceState(), la URL puede cambiar lo que invalida la memoria caché de parámetros y sus valores.

Esta versión actualizará su caché interna de parámetros cada vez que cambie el historial.

Solo usa dos divisiones :

function get(n) {
    var half = location.search.split(n + '=')[1];
    return half !== undefined ? decodeURIComponent(half.split('&')[0]) : null;
}

Estaba leyendo todas las respuestas anteriores y más completas. Pero creo que ese es el método más simple y rápido. Puede consultar este punto de referencia jsPerf

Para resolver el problema en el comentario de Rup, agregue una división condicional cambiando la primera línea a las dos siguientes. Pero la precisión absoluta significa que ahora es más lento que regexp (ver jsPerf ).

function get(n) {
    var half = location.search.split('&' + n + '=')[1];
    if (!half) half = location.search.split('?' + n + '=')[1];
    return half !== undefined ? decodeURIComponent(half.split('&')[0]) : null;
}

Entonces, si sabe que no se encontrará con el contra-caso de Rup, esto gana. De lo contrario, regexp.

O si tiene el control de la cadena de consulta y puede garantizar que un valor que está tratando de obtener nunca contendrá caracteres codificados con URL (sería una mala idea tener estos valores): puede usar la siguiente versión ligeramente más simplificada y legible de la primera opción:

    function getQueryStringValueByName(name) {
        var queryStringFromStartOfValue = location.search.split(name + '=')[1];
         return queryStringFromStartOfValue !== undefined ? queryStringFromStartOfValue.split('&')[0] : null;

Aquí está mi intento de convertir la excelente solución de Andy E en un complemento jQuery completo:

;(function ($) {
    $.extend({      
        getQueryString: function (name) {           
            function parseParams() {
                var params = {},
                    e,
                    a = /\+/g,  // Regex for replacing addition symbol with a space
                    r = /([^&=]+)=?([^&]*)/g,
                    d = function (s) { return decodeURIComponent(s.replace(a, " ")); },
                    q = window.location.search.substring(1);

                while (e = r.exec(q))
                    params[d(e[1])] = d(e[2]);

                return params;
            }

            if (!this.queryStringParams)
                this.queryStringParams = parseParams(); 

            return this.queryStringParams[name];
        }
    });
})(jQuery);

La sintaxis es:

var someVar = $.getQueryString('myParam');

¡Lo mejor de ambos mundos!

Si está haciendo más manipulación de URL que simplemente analizar la cadena de consulta, puede encontrar útil URI.js. Es una biblioteca para manipular URL, y viene con todas las campanas y silbatos. (Perdón por la publicidad propia aquí)

para convertir su cadena de consulta en un mapa:

var data = URI('?foo=bar&bar=baz&foo=world').query(true);
data == {
  "foo": ["bar", "world"],
  "bar": "baz"
}

(URI.js también "correcciones" malas cadenas de consulta gusta ?&foo&&bar=baz&a ?foo&bar=baz)

Me gusta la solución de Ryan Phelan . ¿Pero no veo ningún punto de extender jQuery para eso? No se utiliza la funcionalidad jQuery.

Por otro lado, me gusta la función incorporada en Google Chrome: window.location.getParameter.

Entonces, ¿por qué no usar esto? De acuerdo, otros navegadores no tienen. Entonces, creemos esta función si no existe:

if (!window.location.getParameter ) {
  window.location.getParameter = function(key) {
    function parseParams() {
        var params = {},
            e,
            a = /\+/g,  // Regex for replacing addition symbol with a space
            r = /([^&=]+)=?([^&]*)/g,
            d = function (s) { return decodeURIComponent(s.replace(a, " ")); },
            q = window.location.search.substring(1);

        while (e = r.exec(q))
            params[d(e[1])] = d(e[2]);

        return params;
    }

    if (!this.queryStringParams)
        this.queryStringParams = parseParams(); 

    return this.queryStringParams[key];
  };
}

Esta función es más o menos de Ryan Phelan, pero está envuelta de manera diferente: nombre claro y sin dependencias de otras bibliotecas javascript. Más sobre esta función en mi blog .

Aquí hay una forma rápida de obtener un objeto similar a la matriz PHP $ _GET :

function get_query(){
    var url = location.search;
    var qs = url.substring(url.indexOf('?') + 1).split('&');
    for(var i = 0, result = {}; i < qs.length; i++){
        qs[i] = qs[i].split('=');
        result[qs[i][0]] = decodeURIComponent(qs[i][1]);
    }
    return result;
}

Uso:

var $_GET = get_query();

Para la cadena de consulta, x=5&y&z=hello&x=6esto devuelve el objeto:

{
  x: "6",
  y: undefined,
  z: "hello"
}

Mantenlo simple en código JavaScript simple:

function qs(key) {
    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[key];
}

Llámalo desde cualquier lugar del código JavaScript:

var result = qs('someKey');

Estas son todas excelentes respuestas, pero necesitaba algo un poco más robusto, y pensé que a todos les gustaría tener lo que creé.

Es un método de biblioteca simple que hace disección y manipulación de parámetros de URL. El método estático tiene los siguientes submétodos que se pueden invocar en la URL del asunto:

• getHost
• getPath
• getHash
• setHash
• getParams
• getQuery
• setParam
• getParam
• hasParam
• removeParam

Ejemplo:

URLParser(url).getParam('myparam1')

var url = "http://www.test.com/folder/mypage.html?myparam1=1&myparam2=2#something";

function URLParser(u){
    var path="",query="",hash="",params;
    if(u.indexOf("#") > 0){
        hash = u.substr(u.indexOf("#") + 1);
        u = u.substr(0 , u.indexOf("#"));
    }
    if(u.indexOf("?") > 0){
        path = u.substr(0 , u.indexOf("?"));
        query = u.substr(u.indexOf("?") + 1);
        params= query.split('&');
    }else
        path = u;
    return {
        getHost: function(){
            var hostexp = /\/\/([\w.-]*)/;
            var match = hostexp.exec(path);
            if (match != null && match.length > 1)
                return match[1];
            return "";
        },
        getPath: function(){
            var pathexp = /\/\/[\w.-]*(?:\/([^?]*))/;
            var match = pathexp.exec(path);
            if (match != null && match.length > 1)
                return match[1];
            return "";
        },
        getHash: function(){
            return hash;
        },
        getParams: function(){
            return params
        },
        getQuery: function(){
            return query;
        },
        setHash: function(value){
            if(query.length > 0)
                query = "?" + query;
            if(value.length > 0)
                query = query + "#" + value;
            return path + query;
        },
        setParam: function(name, value){
            if(!params){
                params= new Array();
            }
            params.push(name + '=' + value);
            for (var i = 0; i < params.length; i++) {
                if(query.length > 0)
                    query += "&";
                query += params[i];
            }
            if(query.length > 0)
                query = "?" + query;
            if(hash.length > 0)
                query = query + "#" + hash;
            return path + query;
        },
        getParam: function(name){
            if(params){
                for (var i = 0; i < params.length; i++) {
                    var pair = params[i].split('=');
                    if (decodeURIComponent(pair[0]) == name)
                        return decodeURIComponent(pair[1]);
                }
            }
            console.log('Query variable %s not found', name);
        },
        hasParam: function(name){
            if(params){
                for (var i = 0; i < params.length; i++) {
                    var pair = params[i].split('=');
                    if (decodeURIComponent(pair[0]) == name)
                        return true;
                }
            }
            console.log('Query variable %s not found', name);
        },
        removeParam: function(name){
            query = "";
            if(params){
                var newparams = new Array();
                for (var i = 0;i < params.length;i++) {
                    var pair = params[i].split('=');
                    if (decodeURIComponent(pair[0]) != name)
                          newparams .push(params[i]);
                }
                params = newparams;
                for (var i = 0; i < params.length; i++) {
                    if(query.length > 0)
                        query += "&";
                    query += params[i];
                }
            }
            if(query.length > 0)
                query = "?" + query;
            if(hash.length > 0)
                query = query + "#" + hash;
            return path + query;
        },
    }
}


document.write("Host: " + URLParser(url).getHost() + '<br>');
document.write("Path: " + URLParser(url).getPath() + '<br>');
document.write("Query: " + URLParser(url).getQuery() + '<br>');
document.write("Hash: " + URLParser(url).getHash() + '<br>');
document.write("Params Array: " + URLParser(url).getParams() + '<br>');
document.write("Param: " + URLParser(url).getParam('myparam1') + '<br>');
document.write("Has Param: " + URLParser(url).hasParam('myparam1') + '<br>');

document.write(url + '<br>');

// Remove the first parameter
url = URLParser(url).removeParam('myparam1');
document.write(url + ' - Remove the first parameter<br>');

// Add a third parameter
url = URLParser(url).setParam('myparam3',3);
document.write(url + ' - Add a third parameter<br>');

// Remove the second parameter
url = URLParser(url).removeParam('myparam2');
document.write(url + ' - Remove the second parameter<br>');

// Add a hash
url = URLParser(url).setHash('newhash');
document.write(url + ' - Set Hash<br>');

// Remove the last parameter
url = URLParser(url).removeParam('myparam3');
document.write(url + ' - Remove the last parameter<br>');

// Remove a parameter that doesn't exist
url = URLParser(url).removeParam('myparam3');
document.write(url + ' - Remove a parameter that doesn\"t exist<br>');

De la MDN :

function loadPageVar (sVar) {
  return unescape(window.location.search.replace(new RegExp("^(?:.*[&\\?]" + escape(sVar).replace(/[\.\+\*]/g, "\\$&") + "(?:\\=([^&]*))?)?.*$", "i"), "$1"));
}

alert(loadPageVar("name"));

Código de golf:

var a = location.search&&location.search.substr(1).replace(/\+/gi," ").split("&");
for (var i in a) {
    var s = a[i].split("=");
    a[i]  = a[unescape(s[0])] = unescape(s[1]);
}

¡Muéstralo!

for (i in a) {
    document.write(i + ":" + a[i] + "<br/>");   
};

En mi Mac: test.htm?i=can&has=cheezburgermuestra

0:can
1:cheezburger
i:can
has:cheezburger

Uso muchas expresiones regulares, pero no para eso.

Me parece más fácil y más eficiente leer la cadena de consulta una vez en mi aplicación, y construir un objeto a partir de todos los pares clave / valor como:

var search = function() {
  var s = window.location.search.substr(1),
    p = s.split(/\&/), l = p.length, kv, r = {};
  if (l === 0) {return false;}
  while (l--) {
    kv = p[l].split(/\=/);
    r[kv[0]] = decodeURIComponent(kv[1] || '') || true;
  }
  return r;
}();

Para una URL como http://domain.com?param1=val1&param2=val2usted puede obtener su valor más adelante en su código como search.param1y search.param2.

function GET() {
        var data = [];
        for(x = 0; x < arguments.length; ++x)
            data.push(location.href.match(new RegExp("/\?".concat(arguments[x],"=","([^\n&]*)")))[1])
                return data;
    }


example:
data = GET("id","name","foo");
query string : ?id=3&name=jet&foo=b
returns:
    data[0] // 3
    data[1] // jet
    data[2] // b
or
    alert(GET("id")[0]) // return 3

El método jQuery de Roshambo no se ocupaba de decodificar la URL

http://snipplr.com/view/26662/get-url-parameters-with-jquery--improved/

Acabo de agregar esa capacidad también al agregar en la declaración de devolución

return decodeURIComponent(results[1].replace(/\+/g, " ")) || 0;

Ahora puedes encontrar la esencia actualizada:

$.urlParam = function(name){
var results = new RegExp('[\\?&]' + name + '=([^&#]*)').exec(window.location.href);
if (!results) { return 0; }
return decodeURIComponent(results[1].replace(/\+/g, " ")) || 0;
}

Me gusta este (tomado de jquery-howto.blogspot.co.uk):

// get an array with all querystring values
// example: var valor = getUrlVars()["valor"];
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;
}

Funciona muy bien para mi.

Aquí está mi edición de esta excelente respuesta , con la capacidad adicional de analizar cadenas de consulta con claves sin valores.

var url = 'http://sb.com/reg/step1?param';
var qs = (function(a) {
    if (a == "") return {};
    var b = {};
    for (var i = 0; i < a.length; ++i) {
        var p=a[i].split('=', 2);
        if (p[1]) p[1] = decodeURIComponent(p[1].replace(/\+/g, " "));
        b[p[0]] = p[1];
    }
    return b;
})((url.split('?'))[1].split('&'));

¡IMPORTANTE! El parámetro para esa función en la última línea es diferente. Es solo un ejemplo de cómo se le puede pasar una URL arbitraria. Puede usar la última línea de la respuesta de Bruno para analizar la URL actual.

Entonces, ¿qué cambió exactamente? Con url los http://sb.com/reg/step1?param=resultados serán los mismos. Pero con url, http://sb.com/reg/step1?paramla solución de Bruno devuelve un objeto sin claves, mientras que la mía devuelve un objeto con clave paramy undefinedvalor.

Necesitaba un objeto de la cadena de consulta y odio mucho código. Puede que no sea el más robusto del universo, pero solo son unas pocas líneas de código.

var q = {};
location.href.split('?')[1].split('&').forEach(function(i){
    q[i.split('=')[0]]=i.split('=')[1];
});

Se this.htm?hello=world&foo=barcreará una URL como :

{hello:'world', foo:'bar'}

Aquí hay una versión extendida de la versión vinculada "Manejar cadenas de consulta de estilo de matriz" de Andy E. Corregido error ( ?key=1&key[]=2&key[]=3; 1se pierde y se sustituye por [2,3]), hecho algunas mejoras en el rendimiento menor (re-decodificación de los valores, recalculando "[" posición, etc.) y se añadió una serie de mejoras (funcionalizado, el soporte para ?key=1&key=2, el apoyo a ;delimitadores) . Dejé las variables molestamente cortas, pero agregué comentarios en abundancia para que fueran legibles (oh, y reutilicév dentro de las funciones locales, perdón si eso es confuso;).

Manejará la siguiente cadena de consulta ...

? test = Hello & person = neek & person [] = jeff & person [] = jim & person [extra] = john & test3 & nocache = 1398914891264

... convirtiéndolo en un objeto que se parece a ...

{
    "test": "Hello",
    "person": {
        "0": "neek",
        "1": "jeff",
        "2": "jim",
        "length": 3,
        "extra": "john"
    },
    "test3": "",
    "nocache": "1398914891264"
}

Como puede ver arriba, esta versión maneja algunas medidas de arreglos "malformados", es decir, person=neek&person[]=jeff&person[]=jimo person=neek&person=jeff&person=jimcomo la clave es identificable y válida (al menos en dotNet's NameValueCollection.Add ):

Si la clave especificada ya existe en la instancia de NameValueCollection de destino, el valor especificado se agrega a la lista existente de valores separados por comas en la forma "valor1, valor2, valor3".

Parece que el jurado está un poco interesado en las teclas repetidas, ya que no hay especificaciones. En este caso, se almacenan varias claves como una matriz (falsa). Pero tenga en cuenta que no proceso valores basados ​​en comas en matrices.

El código:

getQueryStringKey = function(key) {
    return getQueryStringAsObject()[key];
};


getQueryStringAsObject = function() {
    var b, cv, e, k, ma, sk, v, r = {},
        d = function (v) { return decodeURIComponent(v).replace(/\+/g, " "); }, //# d(ecode) the v(alue)
        q = window.location.search.substring(1), //# suggested: q = decodeURIComponent(window.location.search.substring(1)),
        s = /([^&;=]+)=?([^&;]*)/g //# original regex that does not allow for ; as a delimiter:   /([^&=]+)=?([^&]*)/g
    ;

    //# ma(make array) out of the v(alue)
    ma = function(v) {
        //# If the passed v(alue) hasn't been setup as an object
        if (typeof v != "object") {
            //# Grab the cv(current value) then setup the v(alue) as an object
            cv = v;
            v = {};
            v.length = 0;

            //# If there was a cv(current value), .push it into the new v(alue)'s array
            //#     NOTE: This may or may not be 100% logical to do... but it's better than loosing the original value
            if (cv) { Array.prototype.push.call(v, cv); }
        }
        return v;
    };

    //# While we still have key-value e(ntries) from the q(uerystring) via the s(earch regex)...
    while (e = s.exec(q)) { //# while((e = s.exec(q)) !== null) {
        //# Collect the open b(racket) location (if any) then set the d(ecoded) v(alue) from the above split key-value e(ntry) 
        b = e[1].indexOf("[");
        v = d(e[2]);

        //# As long as this is NOT a hash[]-style key-value e(ntry)
        if (b < 0) { //# b == "-1"
            //# d(ecode) the simple k(ey)
            k = d(e[1]);

            //# If the k(ey) already exists
            if (r[k]) {
                //# ma(make array) out of the k(ey) then .push the v(alue) into the k(ey)'s array in the r(eturn value)
                r[k] = ma(r[k]);
                Array.prototype.push.call(r[k], v);
            }
            //# Else this is a new k(ey), so just add the k(ey)/v(alue) into the r(eturn value)
            else {
                r[k] = v;
            }
        }
        //# Else we've got ourselves a hash[]-style key-value e(ntry) 
        else {
            //# Collect the d(ecoded) k(ey) and the d(ecoded) sk(sub-key) based on the b(racket) locations
            k = d(e[1].slice(0, b));
            sk = d(e[1].slice(b + 1, e[1].indexOf("]", b)));

            //# ma(make array) out of the k(ey) 
            r[k] = ma(r[k]);

            //# If we have a sk(sub-key), plug the v(alue) into it
            if (sk) { r[k][sk] = v; }
            //# Else .push the v(alue) into the k(ey)'s array
            else { Array.prototype.push.call(r[k], v); }
        }
    }

    //# Return the r(eturn value)
    return r;
};

Esta es una función que creé hace un tiempo y estoy bastante contento. No distingue entre mayúsculas y minúsculas, lo cual es útil. Además, si el QS solicitado no existe, solo devuelve una cadena vacía.

Yo uso una versión comprimida de esto. Estoy publicando sin comprimir para los tipos novatos para explicar mejor lo que está sucediendo.

Estoy seguro de que esto podría optimizarse o hacerse de manera diferente para trabajar más rápido, pero siempre funcionó muy bien para lo que necesito.

Disfrutar.

function getQSP(sName, sURL) {
    var theItmToRtn = "";
    var theSrchStrg = location.search;
    if (sURL) theSrchStrg = sURL;
    var sOrig = theSrchStrg;
    theSrchStrg = theSrchStrg.toUpperCase();
    sName = sName.toUpperCase();
    theSrchStrg = theSrchStrg.replace("?", "&") theSrchStrg = theSrchStrg + "&";
    var theSrchToken = "&" + sName + "=";
    if (theSrchStrg.indexOf(theSrchToken) != -1) {
        var theSrchTokenLth = theSrchToken.length;
        var theSrchTokenLocStart = theSrchStrg.indexOf(theSrchToken) + theSrchTokenLth;
        var theLocOfNextAndSign = theSrchStrg.indexOf("&", theSrchTokenLocStart);
        theItmToRtn = unescape(sOrig.substring(theSrchTokenLocStart, theLocOfNextAndSign));
    }
    return unescape(theItmToRtn);
}

Acabamos de lanzar arg.js , un proyecto destinado a resolver este problema de una vez por todas. Tradicionalmente ha sido muy difícil, pero ahora puedes hacer:

var name = Arg.get("name");

o conseguir todo el lote:

var params = Arg.all();

y si te importa la diferencia entre ?query=truey #hash=truepuedes usar los métodos Arg.query()y Arg.hash().

El problema con la respuesta principal a esa pregunta es que no se admiten parámetros colocados después de #, pero a veces también es necesario para obtener este valor.

Modifiqué la respuesta para permitirle analizar una cadena de consulta completa con un signo hash también:

var getQueryStringData = function(name) {
    var result = null;
    var regexS = "[\\?&#]" + name + "=([^&#]*)";
    var regex = new RegExp(regexS);
    var results = regex.exec('?' + window.location.href.split('?')[1]);
    if (results != null) {
        result = decodeURIComponent(results[1].replace(/\+/g, " "));
    }
    return result;
};

function GetQueryStringParams(sParam)
{
    var sPageURL = window.location.search.substring(1);
    var sURLVariables = sPageURL.split('&');

    for (var i = 0; i < sURLVariables.length; i++)
    {
        var sParameterName = sURLVariables[i].split('=');
        if (sParameterName[0] == sParam)
        {
            return sParameterName[1];
        }
    }
}​

Y así es como puede usar esta función suponiendo que la URL es

http://dummy.com/?stringtext=jquery&stringword=jquerybyexample

var tech = GetQueryStringParams('stringtext');
var blog = GetQueryStringParams('stringword');

Si está usando Browserify, puede usar el urlmódulo de Node.js :

var url = require('url');

url.parse('http://example.com/?bob=123', true).query;

// returns { "bob": "123" }

Lecturas adicionales: URL Node.js v0.12.2 Manual y documentación

EDITAR: puede usar la interfaz URL , está bastante ampliamente adoptada en casi todos los navegadores nuevos y si el código se va a ejecutar en un navegador antiguo, puede usar un polyfill como este . Aquí hay un ejemplo de código sobre cómo usar la interfaz URL para obtener parámetros de consulta (también conocidos como parámetros de búsqueda)

const url = new URL('http://example.com/?bob=123');
url.searchParams.get('bob'); 

También puede usar URLSearchParams para ello, aquí hay un ejemplo de MDN para hacerlo con URLSearchParams:

var paramsString = "q=URLUtils.searchParams&topic=api";
var searchParams = new URLSearchParams(paramsString);

//Iterate the search parameters.
for (let p of searchParams) {
  console.log(p);
}

searchParams.has("topic") === true; // true
searchParams.get("topic") === "api"; // true
searchParams.getAll("topic"); // ["api"]
searchParams.get("foo") === null; // true
searchParams.append("topic", "webdev");
searchParams.toString(); // "q=URLUtils.searchParams&topic=api&topic=webdev"
searchParams.set("topic", "More webdev");
searchParams.toString(); // "q=URLUtils.searchParams&topic=More+webdev"
searchParams.delete("topic");
searchParams.toString(); // "q=URLUtils.searchParams"