In this guide of software tutorials , we’ll show you how to refresh a page in JavaScript . If you are developing a software or script, sometimes you may need to trigger an event, a page refresh within a function. There will be plenty of scenarios and methods for this.
If you want detailed explanations and these software lessons to keep coming, your interest is important. You can follow us on social media addresses. You can also turn on notifications on our website.
First of all, this guide is not for people who know nothing about software, and future guides will not be like that. At a certain and low level, it will be useful for those who are just trying to learn.
JavaScript Page Refresh Code
Every line in the code block below performs the same function. You can use any of them, but when you refresh with the code below, it will transfer things like static files (images, style files, etc.) from the browser cache.
For example, if you are using a dynamically changing image, that image may not change when you refresh the page.
Many people skip this distinction and may have problems with their projects just for this distinction. To refresh without using cache, take a look at the code block below.
In addition, if there is code in any line in this code block , it cancels the POST operation and refreshes it.
So, for example, if there is a form submission process, once the form is submitted, when the form is refreshed with the following codes, it does not submit the form again and refreshes the page.
// Any of the lines will load the page using cache. // If there is a POST operation, it cancels and renews it. // The code in each line performs the same function. You can use any of them. location = location; location = location.href; location = window.location; location = self.location; location = window.location.href; location = self.location.href; location.href = location; location.href = location.href; location.href = window.location; location.href = self.location; location.href = window.location.href; window.location.href = window.location.href; location.reload(); location.reload(false); window.location.reload(); window.location.reload(false);
Every line in the code block below performs the same function. You can use any of them, but when you refresh with the code below, it deletes static files (images, style files, etc.) from the browser cache and downloads them from the server again and displays them. For example, if you are using a dynamically changing image, that image changes when you refresh the page.
Also, if there is code in any line in this code block , it re-sends the POST operation and refreshes it. So, for example, if there is a form submission process, once the form is submitted, when the refresh is done with the following codes, it sends this form again and refreshes the page.
// Any of the lines will load the page by clearing the cache. // If there is a POST operation, it is renewed by sending it again. // The code in each line performs the same function. You can use any of them. location.reload(true); window.location.reload(true);
This code below refreshes the page by deleting the browser history. By browser history, the previous pages you accessed. When you refresh in this way, the back button in your browser will no longer take you to the previous page.
// The following code loads the page by deleting the browser history. var x = window.location.href; window.location.replace(x);
Below are the codes for sample usage scenarios. You can add them to your projects based on them.
Refresh the Page Every 10 Seconds Code
It refreshes the page every 10 seconds by using Cache and canceling POST if there is any.
<script>
functionrefreshpagecontinuous(seconds) {
var t;
t = parseInt(Math.floor(seconds * 1000)); // We converted seconds to milliseconds.
setInterval('location.reload(false)', t); // setInterval is used to run a function continuously at t millisecond intervals.
}
refresh pagecontinuous(10); // You can change the number 10 to whatever you want in the form of seconds.
</script>
Refresh Page Every 10 Seconds Code – Clears Cache and POSTs
It refreshes the page every 10 seconds by deleting the cache and repeating the POST if there is one.
<script>
function reload pagecontinuously(seconds) {
var t;
t = parseInt(Math.floor(seconds * 1000)); // We converted seconds to milliseconds.
setInterval('location.reload(true)', t); // setInterval is used to run a function continuously at t millisecond intervals.
}
refresh pagecontinuous(10); // You can change the number 10 to whatever you want in the form of seconds.
</script>
Refresh Page After 10 Seconds Code
Refreshes the page after 10 seconds using Cache and canceling POST if there is any.
<script>
function refresh page(seconds) {
var t;
t = parseInt(Math.floor(seconds * 1000)); // We converted seconds to milliseconds.
setTimeout('location.reload(false)', t); // setTimeout executes a function once after t milliseconds.
}
refresh page(10); // You can change the number 10 to whatever you want in the form of seconds.
</script>
Refresh Page After 10 Second Code – Deletes Cache and POSTs
It refreshes the page after 10 seconds by deleting the Cache and repeating if there is a POST.
<script>
function refresh page(seconds) {
var t;
t = parseInt(Math.floor(seconds * 1000)); // We converted seconds to milliseconds.
setTimeout('location.reload(true)', t); // setTimeout executes a function once after t milliseconds.
}
refresh page(10); // You can change the number 10 to whatever you want in the form of seconds.
</script>
Read Also: How to View Devices Connected to WiFi
Refreshing the Page When Clicking the Button
Clicking the button refreshes the page. Pure Javascript method.
<button type="submit" onClick="yenile()">Yenileme Butonu</button>
<script>
function yenile(){
location.reload();
}
</script>
Refresh Page Code On Button Click – JQuery
Clicking the button refreshes the page. JQuery method. Of course you need to include the JQuery library in the <head> tag.
<button id="buttontd" type="submit">Refresh Button</button>
<script>
$("#butontd").click( function()
{
alert('Button clicked. Page will be refreshed.'); // To make sure the button is clicked, you can remove
location.reload();
}
);
});
</script>
Yes, in this software lesson, we showed the page refresh process using JavaScript. Page refresh is done with meta tags in HTML and header() function in PHP. If you are also interested in them, you can review their documentation.
If you want more software lessons, you can support. You can be notified of new articles by opening notifications on our site. You can also show your interest by sharing on social media.
See you.