Automatically refresh or reload a page using JavaScript
If you want to reload or refresh the page automatically after a certain time, you can do it using JavaScript. In this article, you will see three different methods to automatically refresh or reload a page.
Checkout more articles on JavaScript
Different methods to auto refresh or reload a page
1. Using setTimeout
If you want to reload a page after a certain time then you can use the setTimeout
function.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | <!DOCTYPE html> <html lang="en"> <head> <title>Page will reload after 5 seconds - Clue Mediator</title> </head> <body> <h1>Page will reload after 5 seconds - Clue Mediator</h1> <script type="text/javascript"> setTimeout(function () { location.reload(); }, 5000); </script> </body> </html> |
In the second parameter, we have to pass the milliseconds so that the written function will be executed after the given milliseconds.
2. Using setInterval
If you want to reload a page after every given seconds then you can use the setInterval
function.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | <!DOCTYPE html> <html lang="en"> <head> <title>Page will reload after every 5 seconds - Clue Mediator</title> </head> <body> <h1>Page will reload after every 5 seconds - Clue Mediator</h1> <script type="text/javascript"> setInterval(function () { location.reload(); }, 5000); </script> </body> </html> |
Same as the setTimeout
, we have to pass the milliseconds in the second parameter.
3. Using meta tag
In this method, you can simply use the http-equiv
meta tag to refresh the content.
1 2 3 4 5 6 7 8 9 10 11 12 13 | <!DOCTYPE html> <html lang="en"> <head> <meta http-equiv="refresh" content="5" /> <title>Page will reload after every 5 seconds - Clue Mediator</title> </head> <body> <h1>Page will reload after every 5 seconds - Clue Mediator</h1> </body> </html> |
That’s it for today.
Thank you for reading. Happy Coding..!! 🙂