Obtener cadena de consulta de la URL usando jQuery [duplicado]

Resuelto Tom asked hace 13 años • 5 respuestas

Tengo la siguiente URL:

http://www.mysite.co.uk/?location=mylocation1

Necesito obtener el valor de locationla URL en una variable y luego usarlo en el código jQuery:

var thequerystring = "getthequerystringhere"

$('html,body').animate({scrollTop: $("div#" + thequerystring).offset().top}, 500);

¿Cómo puedo obtener ese valor usando JavaScript o jQuery?

Tom avatar Jan 11 '11 17:01 Tom
Aceptado

De: http://jquery-howto.blogspot.com/2009/09/get-url-parameters-values-with-jquery.html

Esto es lo que necesitas :)

El siguiente código devolverá un objeto JavaScript que contiene los parámetros de URL:

// 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;
}

Por ejemplo, si tiene la URL:

http://www.example.com/?me=myValue&name2=SomeOtherValue

Este código devolverá:

{
    "me"    : "myValue",
    "name2" : "SomeOtherValue"
}

y puedes hacer:

var me = getUrlVars()["me"];
var name2 = getUrlVars()["name2"];
benhowdle89 avatar Jan 11 '2011 11:01 benhowdle89

Para recuperar la cadena de consulta completa de la URL actual, comenzando con el ?carácter, puede usar

location.search

https://developer.mozilla.org/en-US/docs/DOM/window.location

Ejemplo:

// URL = https://example.com?a=a%20a&b=b123
console.log(location.search); // Prints "?a=a%20a&b=b123" 

En lo que respecta a la recuperación de parámetros de cadenas de consulta específicos, aunque existen clases que gustan URLSearchParamsy URLexisten, Internet Explorer no las admite en este momento y probablemente deberían evitarse. En su lugar, puedes probar algo como esto:

/**
 * Accepts either a URL or querystring and returns an object associating 
 * each querystring parameter to its value. 
 *
 * Returns an empty object if no querystring parameters found.
 */
function getUrlParams(urlOrQueryString) {
  if ((i = urlOrQueryString.indexOf('?')) >= 0) {
    const queryString = urlOrQueryString.substring(i+1);
    if (queryString) {
      return _mapUrlParams(queryString);
    } 
  }
  
  return {};
}

/**
 * Helper function for `getUrlParams()`
 * Builds the querystring parameter to value object map.
 *
 * @param queryString {string} - The full querystring, without the leading '?'.
 */
function _mapUrlParams(queryString) {
  return queryString    
    .split('&') 
    .map(function(keyValueString) { return keyValueString.split('=') })
    .reduce(function(urlParams, [key, value]) {
      if (Number.isInteger(parseInt(value)) && parseInt(value) == value) {
        urlParams[key] = parseInt(value);
      } else {
        urlParams[key] = decodeURI(value);
      }
      return urlParams;
    }, {});
}

Puedes usar lo anterior así:

// Using location.search
let urlParams = getUrlParams(location.search); // Assume location.search = "?a=1&b=2b2"
console.log(urlParams); // Prints { "a": 1, "b": "2b2" }

// Using a URL string
const url = 'https://example.com?a=A%20A&b=1';
urlParams = getUrlParams(url);
console.log(urlParams); // Prints { "a": "A A", "b": 1 }

// To check if a parameter exists, simply do:
if (urlParams.hasOwnProperty('parameterName')) { 
  console.log(urlParams.parameterName);
}

Yene Mulatu avatar Oct 22 '2012 13:10 Yene Mulatu

Una manera fácil de hacer esto con jQuery y JavaScript directo, simplemente vea su consola en Chrome o Firefox para ver el resultado...

  var queries = {};
  $.each(document.location.search.substr(1).split('&'),function(c,q){
    var i = q.split('=');
    queries[i[0].toString()] = i[1].toString();
  });
  console.log(queries);
James avatar May 31 '2012 12:05 James