Comment passer les variables JavaScript dans l'URL?

Dans la phase de programmation de JavaScript, il peut y avoir des situations où le développeur doit ajouter les variables JavaScript dans l'URL dans un cas. Plus précisément, tout en traitant un site accumulant plusieurs pages Web. Dans un tel cas, passer des variables JavaScript dans l'URL est efficace pour rediriger et accéder à toutes les pages Web sur demande.

Cet article développera l'approche pour passer les variables JavaScript dans une URL.

Comment passer les variables JavaScript dans l'URL?

Pour passer les variables dans l'URL à l'aide de JavaScript, appliquez le «SearchParams«Propriété en combinaison avec le«Pushstate ()" et "substring ()«Méthodes.

Comment passer les variables JavaScript dans URL en définissant les valeurs de chaîne initialisées?

Le "fenêtre.emplacement.href»La propriété récupère l'url de la page actuelle. Le "SearchParams«La propriété donne un«UrlSearchParams" objet. Le "histoire.Pushstate ()»La méthode ajoute un enregistrement à la pile d'historique de session du navigateur. Le "diviser()»La méthode divise la chaîne associée dans un tableau et le« «substring ()»Méthode extrait les caractères entre deux indices spécifiés. Ces approches peuvent être utilisées pour définir les paramètres URL personnalisés en passant les valeurs de chaîne contenues dans une variable à l'URL.

Syntaxe

SearchParams.set (nom, valeur);

Dans la syntaxe ci-dessus:

• "nom»Indique le nom du paramètre.
• "valeur»Signifie la valeur du paramètre.

Pushstate (valeur, hist);

Dans la syntaxe donnée:

• "valeur»Porte l'objet qui est associé à la nouvelle entrée.
• "hurler"Est un paramètre requis pour des raisons historiques.

chaîne.substrat (commencez, dernier)

Ici:

• "commencer”Fait référence à la position à partir de laquelle initier l'extraction.
• "dernier"Indique la position où l'extraction doit se terminer, à l'exclusion.

chaîne.Split (séparateur, limite)

Selon le code donné:

• "séparateur»Fait référence à la chaîne qui doit se séparer.
• "limite”Indique que l'entier limite le numéro de division.

Exemple

Passons par la démonstration ci-dessous:

Dans le bloc de code ci-dessus:

• Tout d'abord, initialisez les variables données ayant les valeurs de chaîne indiquées.
• Dans l'étape suivante, créez un nouvel objet URL via le «nouveau»Mot-clé et«URL”Constructeur se référant à l'URL indiquée.
• Après cela, associez le «SearchParams»Propriété avec le«ensemble()«Méthode pour définir les valeurs de telle sorte que cette dernière valeur dans ses paramètres est attribuée à la première.
• Maintenant, ajoutez l'enregistrement à la pile d'historique de session du navigateur via le «Pushstate ()" méthode.
• Aussi, appliquez le combiné "substring ()" et "diviser()»Méthodes pour placer le caractère spécifié à un index particulier, i.e., "1”Dans les valeurs passées dans l'URL.
• Enfin, affichez les valeurs définies passées dans l'URL.

Sortir

Dans la sortie ci-dessus, on peut observer que les valeurs de chaîne initialisées ont été définies, séparées et passées dans l'URL et affichées sur la console.

Conclusion

Pour passer les variables JavaScript dans l'URL, appliquez le «SearchParams«Propriété combinée avec le«Pushstate ()" et "substring ()«Méthodes. Ces approches peuvent être appliquées pour allouer et séparer les paramètres d'URL en passant les valeurs de chaîne initialisées contenues dans une variable à l'URL. Ce blog a indiqué l'approche pour passer les variables JavaScript dans l'URL.