Comment actualiser automatiquement la page Web toutes les 5 secondes à l'aide de JavaScript
En JavaScript, il y a des situations où nous devons nous assurer que le contenu entré sur un site particulier est précis et à jour. Par exemple, il est nécessaire d'afficher le contenu le plus récent sur une page Web tout en remplissant un long formulaire et en observant les nouvelles modifications ou lorsque vous souhaitez tester un site Web. Dans de tels cas, la réflexion automatique d'une page Web toutes les 5 secondes à l'aide de JavaScript est très utile pour faire face à ces types de situations.
Cet article discutera des méthodes pour actualiser automatiquement une page Web toutes les 5 secondes à l'aide de JavaScript.
Comment actualiser automatiquement la page Web toutes les 5 secondes à l'aide de JavaScript?
Pour actualiser automatiquement une page Web toutes les 5 secondes à l'aide de JavaScript, les approches suivantes peuvent être utilisées:
- "setInterval ()" et "document.QuerySelector ()«Méthodes
- "rafraîchir()" méthode
- "setTimeout ()" méthode
Passer par les méthodes discutées une par une!
Méthode 1: Page Web de rafraîchissement automatique toutes les 5 secondes en JavaScript à l'aide de setInterval () et de document.Méthodes QueySelector ()
Le "setInterval ()»La méthode accède à une fonction à l'intervalle de temps spécifié et le« «document.QuerySelector ()”La méthode obtient le premier élément qui correspond à un sélecteur CSS. Ces méthodes peuvent être utilisées en combinaison pour accéder à la balise d'en-tête spécifique et définir l'intervalle de temps sur une fonctionnalité requise à l'aide d'une minuterie.
Syntaxe
setInterval (fonction, millisecondes, par1, par2)Dans la syntaxe ci-dessus, "fonction"Fait référence à la fonction qui doit être accessible,"millisecondes"Est l'intervalle de temps spécifique à exécuter, et"par1" et "par2"Sont les paramètres supplémentaires.
document.QueySelector (sélecteurs CSS)Ici, "Sélecteurs CSS»Représente un ou plusieurs sélecteurs CSS.
Découvrez l'exemple suivant.
Exemple
Tout d'abord, spécifiez un titre et une rubrique dans le et
Tags, respectivement:
Actualiser automatiquement la page
Maintenant, définissez une valeur de minuterie comme «1»:
Laissez Timer = 1;Après cela, appliquez le «setInterval ()«Méthode avec un«1000 ms" valeur. Cela augmentera la minuterie à chaque seconde. Accédez également à la rubrique spécifiée pour l'afficher sur le «Document Object Model (DOM)”À la fin de la valeur de la minuterie définie.
Enfin, itérez la valeur de la minuterie avec l'augmentation de «1" en utilisant "++»Opérateur post-incidence et appliquez une condition de telle manière que si la valeur dépasse 5, le«emplacement.recharger()«La méthode entraînera le rechargement de la fenêtre:
setInterval (() =>document.queySelector ('H2').innerText = timer;
Timer ++;
if (temporisateur> 5)
emplacement.recharger();
, 1000);
On peut voir que notre page Web obtient une actualisation automatique toutes les cinq secondes:
Méthode 2: Page Web de rafraîchissement automatique toutes les 5 secondes en JavaScript à l'aide de l'événement Onload
Le "en charge»L'événement est déclenché lorsqu'un objet a été chargé. Cette technique peut être implémentée pour actualiser la page à l'aide d'une fonction définie par l'utilisateur lorsque la page Web est chargée.
Syntaxe
objet.onload = refreshPage () myscript;Dans la syntaxe donnée, "fonction»Fait référence à la fonction qui doit être invoquée lorsque l'objet est chargé.
Regardez l'exemple suivant.
Exemple
Tout d'abord, incluez un titre et une rubrique comme indiqué dans la méthode précédente:
Actualiser automatiquement la page
Maintenant, appliquez le «en charge«Événement et invoque la fonction«rafraîchir la page()"Et passez"5000«Comme argument qui indique l'intervalle de temps de cinq secondes:
Enfin, définissez une fonction nommée «rafraîchir la page()" avec "t"Comme argument qui fait référence à l'heure définie pour rafraîchir automatiquement la page Web. Le "emplacement.recharger()»La méthode rechargera la page après l'heure spécifiée:
Fonction Refreshpage (t)setTimeout ("l'emplacement.recharger (true); ", t);
Sortir
Méthode 3: Page Web de rafraîchissement automatique toutes les 5 secondes en javascript à l'aide de la méthode setTimeout ()
Le "setTimeout ()»La méthode invoque une fonction après une heure définie spécifiée. Cette méthode peut être appliquée pour recharger une page Web après un délai d'exécution spécifique.
Syntaxe
setTimeout (fonction, millisecondes, par1, par2)Dans la syntaxe donnée, "fonction»Fait référence à la fonction qui est accessible:«millisecondes"Est l'intervalle de temps spécifique à exécuter, et"par1","par2"Sont les paramètres supplémentaires.
Exemple
Dans la balise de script de la page HTML, appliquez le «setTimeout ()”Méthode de cette manière lorsque 5 secondes sont passées, l'emplacement.La méthode recharger () recharge la page Web:
Sortir
Nous avons discuté de toutes les méthodes pratiques pour actualiser automatiquement une page Web toutes les 5 secondes en utilisant JavaScript.
Conclusion
Pour actualiser automatiquement une page Web toutes les 5 secondes à l'aide de JavaScript, utilisez le «setInterval ()" et "document.QuerySelector ()«Méthodes pour ajuster la valeur du minuteur, le«rafraîchir()«Méthode pour rafraîchir une page Web, ou le«setTimeout ()«Méthode pour définir une limite de rafraîchissement de délai d'expiration spécifique d'une page Web. Cet article a démontré les méthodes pour actualiser automatiquement une page Web toutes les 5 secondes à l'aide de JavaScript.