Actualiser la page dans jQuery

Dans l’article d’aujourd’hui, nous allons apprendre à rafraîchir la page en utilisant les objets location et history dans jQuery.

Utilisez la méthode location.reload() pour actualiser la page dans jQuery

Uniform Resource Locator est l’emplacement de la page, représenté par l’interface location. Les modifications qui lui sont apportées sont reflétées dans l’objet auquel il se réfère.

Les interfaces de document et de fenêtre ont un emplacement associé accessible via Document.location et Window.location, respectivement.

Comme le bouton Actualiser, la technique location.reload() recharge l’URL existante. location.reload() est une méthode JavaScript bien connue ; par conséquent, vous n’avez pas besoin de jQuery pour cela.

Le rechargement peut se bloquer et lancer une exception DOM SECURITY_ERROR. Cela se produit si la base du script appelle location.reload() diffère de l’origine de la page qui possède l’objet location.

Syntaxe:

reload();

Comprenons-le avec l’exemple suivant.

Remarque : Le code suivant ne peut pas être exécuté de cette façon et n’a pas de sortie. Il doit être ajouté à un code existant pour afficher les résultats.

Code HTML:

<p>Hello World!</p>
<button type="button" id="btn">Reload</button>

Code JavaScript :

$('#btn').click(function() {
  location.reload();
});

Essayez d’exécuter l’extrait de code ci-dessus dans n’importe quel navigateur prenant en charge jQuery. Il va recharger la page.

Utilisez la méthode history.go() pour actualiser la page dans jQuery

La méthode history.go() charge une page spécifique d’historique de session. Vous pouvez l’utiliser pour vous déplacer dans l’historique en fonction de la valeur d’un paramètre ; cette méthode est asynchrone.

La méthode history.go() charge une URL depuis l’historique du navigateur en fonction du paramètre passé. Si le paramètre donné est 0, il rechargera la page en cours.

Syntaxe:

history.go(0);

Comprenons-le avec l’exemple suivant.

Remarque : Le code suivant ne peut pas être exécuté de cette façon et n’a pas de sortie. Il doit être ajouté à un code existant pour afficher les résultats.

Code HTML:

<p>Hello World!</p>
<button type="button" id="btn">Reload</button>

Code JavaScript :

$('#btn').click(function() {
  history.go(0);
});

Essayez d’exécuter l’extrait de code ci-dessus dans n’importe quel navigateur prenant en charge jQuery. Il va recharger la page.

Voir la démo ici.