Lorsque l’on explore la hiérarchie des objets JavaScript, on découvre un élément essentiel : l’objet Location. Cet objet est une propriété de l’objet global window. Il appartient à la famille des objets de type Location, parmi lesquels l’objet window.location se distingue comme un exemple concret. L’objet Location offre des fonctionnalités cruciales pour interagir avec les URL des pages web.
Contexte :
Lorsque l’on programme en JavaScript et que l’on travaille avec des pages web, il est souvent nécessaire d’accéder et de manipuler les URL. L’objet Location joue un rôle central dans cette tâche. Il permet d’extraire des informations spécifiques de l’URL, telles que les paramètres passés dans l’adresse, de rediriger l’utilisateur vers d’autres pages web, ou encore de rafraîchir la page actuelle. Cette connaissance de l’objet Location est cruciale pour de nombreuses opérations de navigation et d’interaction avec le web à travers JavaScript.
L’objet Location en JavaScript est un composant essentiel pour interagir avec les URL des pages web. Il permet d’accéder à diverses informations et de réaliser des actions de navigation.
Propriété | Utilité | Exemple |
---|---|---|
href | Renvoie une chaîne avec l’URL complète. | alert('URL : ' + window.location.href); |
protocol | Renvoie le protocole URL, généralement http ou https. | alert('Protocole : ' + window.location.protocol); |
host | Renvoie le nom du serveur, généralement sous forme de nom de domaine, et, si un port spécifié existe, séparé par :. | alert('Hôte : ' + window.location.host); |
hostname | Renvoie le domaine ou le serveur. | alert('Nom d'hôte : ' + window.location.hostname); |
pathname | Renvoie le chemin à l’exclusion du nom de domaine ou du serveur. | alert('Chemin : ' + window.location.pathname); |
search | Renvoie la chaîne qui représente les paramètres qui existent dans l’URL. | alert('Paramètres : ' + window.location.search); |
hash | Renvoie # suivi d’un texte si dans l’URL il y a un # suivi d’un texte (ancre d’emplacement du fragment html). | alert('Localisateur : ' + window.location.hash); |
origin | Renvoie une chaîne représentant la racine du site Web | alert('Origine : ' + window.location.origin); |
Méthode | Utilité | Exemple |
---|---|---|
assign(URL de destination) | Attribue une URL à la fenêtre actuelle, provoquant le chargement de l’URL de destination. L’utilisateur peut revenir en arrière avec le bouton Précédent du navigateur. | alert("Transfert vers lecoursgratuit.com"); window.location.assign('http://lecoursgratuit.com'); |
reload(opcIfFromServer) | Provoque le rechargement de l’URL actuelle. Si true est indiqué en paramètre, le rechargement se fera depuis le serveur (rafraîchissement complet). S’il n’est pas précisé ou est faux, le rechargement peut se faire depuis le cache. | alert('Rechargement de la page... '); window.location.reload(true); |
replace(URL de destination) | Attribue une URL à la fenêtre actuelle, provoquant le chargement de l’URL de destination. L’utilisateur ne peut pas revenir en arrière avec le bouton Précédent du navigateur. | alert('Remplacement de la page... '); window.location.replace('http://lecoursgratuit.com'); |
toString() | Renvoie une chaîne représentative de l’URL (window.location.toString() renvoie la même chose que window.location.href) | alert('URL actuelle : ' + window.location.toString()); |
Supposons une URL construite selon ce modèle : http://lecoursgratuit.com/index.php?option=compra&moneda=euro&producto=libro1
, où le paramètre d’option peut être acheter, vendre ou échanger. Le paramètre monétaire peut être le peso mexicain, l’euro, le peso argentin, le peso colombien, le bolivar, le sol, le peso chilien. Et le paramètre product peut avoir n’importe quelle valeur.
Si nous souhaitons récupérer la valeur du paramètre de devise à l’aide de JavaScript, voici un exemple de code que nous pouvons utiliser en enregistrant le fichier sous le nom example1.html
:
<!DOCTYPE html>
<html>
<head>
<title>Exemple lecoursgratuit.com</title>
<meta charset="utf-8">
<script type="text/javascript">
function extractUrlParameter(parameterName) {
var urlParams = new URLSearchParams(window.location.search);
return urlParams.get(parameterName);
}
var currency = extractUrlParameter('moneda');
if (currency) {
alert('Valeur du paramètre de devise dans l\'URL : ' + currency);
} else {
alert('Le paramètre de devise n\'a pas été trouvé dans l\'URL.');
}
</script>
</head>
<body>
<h1>Exemple d'utilisation de window.location</h1>
</body>
</html>
Ce code permettra d’extraire et d’afficher la valeur du paramètre de devise de l’URL du site “www.lecoursgratuit.com” dans une boîte d’alerte.
Le calcul des flux de trésorerie (ou cash flows) consiste à mesurer les entrées et…
Voici un guide détaillé sur la rédaction d'un QCM d'analyse financière, avec des exemples concrets…
Objectif : Cette fiche pratique explique les principaux ratios d'endettement, comment les calculer, et leur…
Ce guide vous aide à rédiger un QCM Analyse Financière structuré et pertinent sur l'analyse…
Le marketing de la mode est un domaine stratégique essentiel pour promouvoir une marque, une…
Dans le cadre de la gestion des entreprises, le Questionnaire à Choix Multiples (QCM) est…
This website uses cookies.