225 votes

Différence entre window.location.href=window.location.href et window.location.reload()

Quelle est la différence entre JavaScript

window.location.href = window.location.href

et

window.location.reload()

fonctions ?

283voto

David Johnstone Points 10565

Si je me souviens bien, window.location.reload() recharge la page actuelle avec des données POST, tandis que window.location.href=window.location.href ne comprend pas les données POST.

Comme l'a noté @W3Max dans les commentaires ci-dessous, window.location.href=window.location.href ne rechargera pas la page s'il y a une ancre (#) dans l'URL - Vous devez utiliser la fonction window.location.reload() dans ce cas.

Aussi, comme l'a noté @Mic ci-dessous, window.location.reload() prend un argument supplémentaire skipCache de sorte qu'en utilisant window.location.reload(true) le navigateur ignorera le cache et rechargera la page depuis le serveur. window.location.reload(false) fera l'inverse, et chargera la page depuis le cache si possible.

12 votes

Notez que lorsque vous utilisez window.location.reload() sur un POST, le navigateur vous demandera si vous voulez renvoyer les données pour recharger la page.

3 votes

@Wimmel, y a-t-il un moyen de désactiver ce message ?

43 votes

Window.location.href=window.location.href ne rechargera pas la page s'il y a une ancre (#) dans l'URL - Vous devez utiliser window.location.reload() dans ce cas.

55voto

Mic Points 13418

Si vous dites window.location.reload(true) le navigateur ignorera le cache et rechargera la page depuis le serveur. window.location.reload(false) fera l'inverse.

Note : default valeur pour window.location.reload() est false

6 votes

@Ismail - La valeur par défaut est false.

2 votes

Google Chrome 32, lors de l'utilisation de webRTC le vrai/faux n'a pas fonctionné pour moi. J'avais une iframe avec webRTC et j'utilisais uniquement la fonction window.location.href = window.location.href a fait l'affaire.

0 votes

Si vous avez apporté des modifications à un formulaire sur la page, les modifications mai disparaissent (reviennent aux valeurs en cache) en fonction du navigateur lors de l'utilisation de l'option location.reload() ou location.reload(false) . Pour effectuer un rafraîchissement complet de la page, utilisez location.reload(true) .

33voto

Fabien Ménager Points 45472

La différence est que

window.location = document.URL;

ne rechargera pas la page s'il y a un dièse (#) dans l'URL (avec ou sans quelque chose après), alors que

window.location.reload();

rechargera la page.

2 votes

Tous les navigateurs n'ont pas ce problème avec la fin des hases. Si les hashs de fin sont un problème pour vous, essayez : window.location = document.URL.replace(/#$/, '') ;

1 votes

Au moins Chrome est concerné. J'avais l'habitude de prendre location.href = location.href pour acquis, mais je viens de remarquer ce comportement exact et je suis venu à SO pour répandre le mot. Utilisez simplement location.reload() à la place.

1 votes

Vous pouvez également utiliser window.location.pathname au lieu d'écrire une telle expression régulière. Par exemple : window.location.replace(window.location.pathname);

20voto

mplungjan Points 36458

Si vous ajoutez le booléen true au rechargement window.location.reload(true) il sera chargé depuis le serveur.

Il n'est pas clair dans quelle mesure ce booléen est soutenu, W3Org mentionne que NS utilisé pour soutenir il

Il peut y avoir une différence entre le contenu de window.location.href et celui de window.location.href. document.URL - il y avait au moins une différence entre location.href et le système non standard et déprécié document.location qui avait à voir avec la redirection, mais c'est vraiment du dernier millénaire.

À des fins de documentation, j'utiliserais window.location.reload() parce que c'est ce que vous voulez faire.

0 votes

Regardez stackoverflow.com/a/5091619/429972 puisque cela explique la différence.

6voto

mrj Points 45

Une différence dans Firefox (12.0) est que sur une page rendue à partir d'un POST, reload() affichera un avertissement et effectuera un nouveau post, alors qu'une affectation d'URL effectuera un GET.

Google Chrome fait un GET pour les deux.

1 votes

Chrome 38 semble désormais utiliser POST pour .reload().

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X