JavaScript Obtener parámetros de URL

Harshit Jindal 12 octubre 2023
  1. Utilice los parámetros de búsqueda del objeto URL para obtener los valores de los parámetros GET
  2. Utilice location.search para obtener los valores de los parámetros GET
JavaScript Obtener parámetros de URL

Este tutorial enseña cómo obtener los valores de los parámetros GET.

Utilice los parámetros de búsqueda del objeto URL para obtener los valores de los parámetros GET

El objeto URL representa la URL definida por los parámetros. Podemos utilizar su propiedad searchParams para devolver un objeto URLSearchParams que nos permite acceder a los parámetros decodificados en GET. Entonces podemos usar la función get adjunta al objeto URLSearchParams para obtener el valor de cualquier parámetro dentro de la URL.

var input_string =
    'http://www.google.com/app.html?apple=1&banana=3&cherry=m2';  // window.location.href
var url = new URL(input_string);
var cherry = url.searchParams.get('cherry');
console.log(cherry);

En el código anterior, primero obtenemos el objeto URLSearchParams y luego usamos su función get para obtener valores de parámetros decodificados.

Utilice location.search para obtener los valores de los parámetros GET

La propiedad de búsqueda de location es básicamente una cadena de búsqueda que también se denomina query string. Para obtener los valores de los parámetros, dividimos la cadena y luego almacenamos los parámetros y sus valores en un diccionario. Luego, podemos usar fácilmente el diccionario para obtener todos los pares de claves y valores.

var GET_parameters = {};

if (location.search) {
  var splitts = location.search.substring(1).split('&');
  for (var i = 0; i < splitts.length; i++) {
    var key_value_pair = splitts[i].split('=');
    if (!key_value_pair[0]) continue;
    GET_parameters[key_value_pair[0]] = key_value_pair[1] || true;
  }
}

var abc = GET_parameters.abc;

Todos los métodos discutidos son compatibles con los principales navegadores.

Harshit Jindal avatar Harshit Jindal avatar

Harshit Jindal has done his Bachelors in Computer Science Engineering(2021) from DTU. He has always been a problem solver and now turned that into his profession. Currently working at M365 Cloud Security team(Torus) on Cloud Security Services and Datacenter Buildout Automation.

LinkedIn