JavaScript Obtenir les paramètres d'URL

Harshit Jindal 12 octobre 2023
  1. Utilisez searchParams de l’objet URL pour obtenir les valeurs des paramètres GET
  2. Utilisez location.search pour obtenir les valeurs des paramètres GET
JavaScript Obtenir les paramètres d'URL

Ce tutoriel explique comment obtenir les valeurs des paramètres GET.

Utilisez searchParams de l’objet URL pour obtenir les valeurs des paramètres GET

L’objet URL représente l’URL définie par les paramètres. On peut utiliser sa propriété searchParams pour retourner un objet URLSearchParams qui permet d’accéder aux paramètres décodés dans GET. Nous pouvons ensuite utiliser la fonction get attachée à l’objet URLSearchParams pour obtenir la valeur de n’importe quel paramètre à l’intérieur de l’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);

Dans le code ci-dessus, nous obtenons d’abord l’objet URLSearchParams puis utilisons sa fonction get pour obtenir les valeurs de paramètres décodées.

Utilisez location.search pour obtenir les valeurs des paramètres GET

La propriété search de location est essentiellement une chaîne de recherche qui est également appelée query string. Pour obtenir les valeurs des paramètres, nous divisons la chaîne puis stockons les paramètres et leurs valeurs dans un dictionnaire. Nous pouvons ensuite facilement utiliser le dictionnaire pour obtenir toutes les paires de clés et de valeurs.

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;

Toutes les méthodes décrites sont prises en charge par tous les principaux navigateurs.

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