window.location

Renvoie un objet Location contenant des informations concernant l'URL actuelle du document et fournit des méthodes pour modifier cette URL. Cette propriété peut être utilisée pour charger une autre page.

Syntaxe

  var adresseActuelle = window.location;
  window.location = nouvelleAdresse;

  • adresseActuelle est un objet de type Location, fournissant des informations à propos de l'URL courante et des méthodes pour la modifier. Ses propriétés et méthodes sont décrites ci-dessous.
  • nouvelleAdresse est un objet Location ou une chaîne de caractères indiquant l'URL à charger.

L'objet Location

Les objets Location ont une méthode toString renvoyant l'URL courante. Il est également possible d'assigner une chaîne à document.location. Cela signifie que document.location peut être utilisé comme s'il s'agissait d'une chaîne dans la plupart des cas. De temps en temps, par exemple pour appeler une méthode d'objet String, il est nécessaire d'appeler explicitement toString :

alert(document.location.toString().charAt(17))

Propriétés

Toutes les propriétés suivantes sont des chaînes de caractères. Elles peuvent être lues pour obtenir des informations concernant l'URL courante, ou modifiées pour accéder à une autre adresse URL.

La colonne « Exemple » contient les valeurs de ces propriétés pour l'URL suivante : http://www.example.com:8080/search?q=devmo#test

Propriété Description Exemple
hash La partie de l'URL qui suit le symbole « # », s'il y en un, avec ce symbole inclus. Une chaîne de caractères vide s'il n'y a pas de symbole #, ou qu'il n'est suivi par rien. Vous pouvez écouter l'évènement hashchange pour être alerté des changements du hash dans les navigateurs le supportant. #test
host Le nom de l'hôte et son numéro de port. www.example.com:8080
hostname Le nom de l'hôte (sans son numéro de port). www.example.com
href L'URL entière. http://www.example.com:8080/search?q=devmo#test
origin L'origine de l'URL http://www.example.com:8080
pathname Le chemin (relativement à l'hôte). /search
port Le numéro de port de l'URL. Si l'URL n'a pas de port (si le site utilise le port 80, le port par défaut de la plupart des sites), une chaîne de caractères vide est renvoyée. 8080
protocol Le protocole de l'URL. http:
search La partie de l'URL qui suit le symbole « ? », avec ce symbole inclus ?q=devmo

Méthodes

Méthode Description
assign(url) Charge le document situé à l'URL spécifiée.
reload(forceget) Recharge le document depuis l'URL actuelle. forceget est une valeur booléenne, qui lorsqu'elle vaut true force la page à être rechargée depuis le serveur. Si elle vaut false ou n'est pas précisée, le navigateur peut recharger la page depuis son cache.
replace(url) Remplace le document courant par celui situé à l'URL fournie. La différence avec la méthode assign() est qu'après un replace(), la page courante ne sera pas enregistrée dans l'historique de la session, ce qui signifie que l'utilisateur ne pourra pas utiliser le bouton « Page précédente » pour y retourner.
toString() Renvoie la représentation sous forme de chaîne de l'URL de l'objet Location. Consultez la référence JavaScript pour plus de détails.

Exemples

Exemple 1 : Naviguer vers une nouvelle page

A chaque fois qu'une nouvelle valeur est assignée à l'objet Location, un document sera chargé en utilisant l'URL fournie, comme si window.location.assign() avait été appelé avec la nouvelle URL.

window.location.assign("http://www.mozilla.org"); // ou
window.location = "http://www.mozilla.org";

Exemple 2 :  Forcer le rechargement de la page actuelle depuis le serveur

window.location.reload(true);

Exemple 3 : Afficher les propriétés de l'URL actuelle dans une fenêtre d'alerte

function montrerLoc() {
  var oLocation = window.location, aLog = ["Propriété (Typeof): valeur", "window.location (" + (typeof oLocation) + "): " + oLocation ];
  for (var sProp in oLocation){
    aLog.push(sProp + " (" + (typeof oLocation[sProp]) + "): " +  (oLocation[sProp] || "n/a"));
  }
  alert(aLog.join("\n"));
}

// dans le HTM: <button onclick="montrerLoc();">Montrer les propriétés de Location</button>
function envoyerDonnees (sData) {
  window.location.search = sData;
}

// dans le HTML : <button onclick="envoyerDonnees('des infos');">Envoyer des données</button>

L'adresse URL complêtée par "?des%20infos" est envoyée au serveur (si aucune action est prise en charge par le serveur, le document actuel est rechargé avec la nouvelle chaîne de caractère modifié).

Exemple 5 : Obtenir la valeur d'un paramètre de l'URL par window.location.search

function obtenirParametre (sVar) {
  return unescape(window.location.search.replace(new RegExp("^(?:.*[&\\?]" + escape(sVar).replace(/[\.\+\*]/g, "\\$&") + "(?:\\=([^&]*))?)?.*$", "i"), "$1"));
}

alert(obtenirParametre("nom"));

Exemple 6 : Placer les valeurs obtenues par window.location.search dans un objet nommé oParametres

var oParametre = {};

if (window.location.search.length > 1) {
  for (var aItKey, nKeyId = 0, aCouples = window.location.search.substr(1).split("&"); nKeyId < aCouples.length; nKeyId++) {
    aItKey = aCouples[nKeyId].split("=");
    oParametre[unescape(aItKey[0])] = aItKey.length > 1 ? unescape(aItKey[1]) : "";
  }
}

// alert(oParametre.votreValeur);

… la même chose avec un constructeur anonyme :

var oParametre = new (function (sRecherche) {
  if (sRecherche.length > 1) {
    for (var aItKey, nKeyId = 0, aCouples = sRecherche.substr(1).split("&"); nKeyId < aCouples.length; nKeyId++) {
      aItKey = aCouples[nKeyId].split("=");
      this[unescape(aItKey[0])] = aItKey.length > 1 ? unescape(aItKey[1]) : "";
    }
  }
})(window.location.search);

// alert(oParametre.votreValeur);

Spécification

WHATWG HTML Living Standard

Compatibilité des navigateurs

Fonctionnalité Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Support basique (Oui)

(Oui)

(Oui) (Oui) (Oui)
window.location.origin

(Oui)

21 (21) ? ? ?
Fonctionnalité Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Support basique (Oui) (Oui) (Oui) (Oui) (Oui)
window.location.origin ? 21.0 (21) ? ? ?

Voir également

Étiquettes et contributeurs liés au document

Contributeurs à cette page : fscholz, maelito, tregagnon, Julien.stuby, Mgjbot, BenoitL
Dernière mise à jour par : maelito,