Refresh a page using JavaScript or HTML

Question

How can I refresh a page using JavaScript or HTML?

First entire PAGE of google with your question gives you the answer. — stefan, Mar 14 '11 at 04:50
question like this should be closed. users should be encouraged to do such a simple search first, encourage to read.. — amosrivera, Mar 14 '11 at 04:51
@amosrivera - Indicated by the ratio of upvotes to downvotes on this question, there is a silent majority of users who very much appreciate being able to find answers to questions like this on Stackoverflow — Chris Dutrow, Apr 05 '12 at 12:41
@stefan: Thankfully, Google brought me (and thousands of others) here -- to find the *best* answers. — Brent Bradburn, Aug 13 '14 at 04:12
This question allows for a pure HTML answer (no JS), and the answer that's current top voted here includes an HTML option. In that respect, this question is different than the one that's marked duplicate of. — Brick, Dec 07 '16 at 17:21
Sadly, when you googgle for "auto refreshing a page via js" this one is the first page which appears, so not answering here is kinda pointless :) — Alar, Jan 29 '18 at 12:34
@stefan Aaaand take a guess what is right up there at the top of that page... — shawnseanshaun, Apr 10 '18 at 18:54

score 350 · Answer 1 · answered Mar 14 '11 at 04:49

350

window.location.reload(); in JavaScript

<meta http-equiv="refresh" content="1"> in HTML (where 1 = 1 second).

answered Mar 14 '11 at 04:49

Reid

18,959
5
37
37

epoch · Answer 2 · 2016-02-23T09:48:18.943

285

Here are 535 ways to reload a page using javascript, very cool:

Here are the first 20:

location = location
location = location.href
location = window.location
location = self.location
location = window.location.href
location = self.location.href
location = location['href']
location = window['location']
location = window['location'].href
location = window['location']['href']
location = window.location['href']
location = self['location']
location = self['location'].href
location = self['location']['href']
location = self.location['href']
location.assign(location)
location.replace(location)
window.location.assign(location)
window.location.replace(location)
self.location.assign(location)

and the last 10:

self['location']['replace'](self.location['href'])
location.reload()
location['reload']()
window.location.reload()
window['location'].reload()
window.location['reload']()
window['location']['reload']()
self.location.reload()
self['location'].reload()
self.location['reload']()
self['location']['reload']()

_{Original Article}

edited Feb 23 '16 at 09:48

answered Oct 03 '11 at 07:11

epoch

16,396
4
43
71

121

no, i did not test them all – epoch Jan 10 '14 at 08:06
16

All the ones setting window.location to a variable (not executing a function) won't refresh if your address bar has a #hashValue in it, it will simply move to that ID on the page if it exists. – Arve Systad Oct 30 '14 at 19:56
8

alot of the entries in that list are simply the same thing with different syntax, such as `[]` vs `.` syntax for accessing object properties. – RozzA Apr 24 '16 at 22:15
Wow, look at the webpages source code, the repeating list is repeated so long he just used javascript to generate all the possible permutations instead of writing out his own ideas of ways. – Jack G Dec 12 '16 at 20:27
There's only 534 now.. which one has gone? – simonmysun Dec 13 '16 at 09:37
Wow, that's a lot of ways. I've probably only used 5-6 at most. @simonmysun It looks like there are now 535 ways. The bold text says 534, but the actually 535. – Matthew Campbell Jan 11 '17 at 02:41
Hahah, I just wonder whether there's a deprecated spec. – simonmysun Jan 12 '17 at 13:08
I read the source and find in line 85 there's a `r.length-1`. don't know why. – simonmysun Jan 12 '17 at 13:08
Oh then I see 'other'. ignore me I am an idiot. – simonmysun Jan 12 '17 at 13:10
which is the best and what about cross-browser support (including IE4 compatibility)? ;) – Kamil Kiełczewski Apr 29 '17 at 14:22
There are many ways to go to Rome – Taufik Nur Rahmanda Oct 23 '17 at 03:20
1

But missing `window.history.go(0)` ;) – Taufik Nur Rahmanda Oct 23 '17 at 03:22

score 87 · Answer 3 · edited Aug 29 '15 at 01:37

87

simply use..

location.reload(true/false);

If false, the page will be reloaded from cache, else from the server.

edited Aug 29 '15 at 01:37

Anik Islam Abhi

25,137
8
58
80

answered Sep 26 '13 at 06:23

Wolv3rine

911
7
8

19

And default value is `false` for reload page from the cache. – Nabi K.A.Z. Nov 19 '17 at 15:13
4

this answer made my day, or more precise: my night... had a problem with location.reload() and some modal windows which were stuck in a previous state. location.reload(true); was the solution, as the default is indeed false, as Nabi K.A.Z. states. thank you very much... – Canelo Digital Jan 13 '18 at 04:53
2

Now deprecated. Use `window.location.reload()` instead. – TD1 Mar 30 '21 at 16:43
2

NOTE: this will resubmit a form – Elia Weiss May 10 '21 at 06:05

score 17 · Answer 4 · answered Mar 14 '11 at 04:52

17

window.location.reload()

should work however there are many different options like:

window.location.href=window.location.href

answered Mar 14 '11 at 04:52

Mike Lewis

63,433
20
141
111

"window.location.href=window.location.href" doesn't seem to work anymore – dawsnap May 08 '19 at 08:49

score 13 · Answer 5 · answered Sep 15 '15 at 11:07

13

You can also use

<input type="button" value = "Refresh" onclick="history.go(0)" />

It works fine for me.

answered Sep 15 '15 at 11:07

Mandeep Singh

1,287
14
34

2

NOTE: this will resubmit a form – Elia Weiss May 10 '21 at 06:00

score 6 · Answer 6 · answered Mar 14 '11 at 04:51

6

Use:

window.location.reload();

answered Mar 14 '11 at 04:51

Rob

10,004
5
61
91

score 2 · Answer 7 · answered Dec 02 '13 at 00:24

If it has something to do control updates on cached pages here I have a nice method how to do this.

add some javascript to the page that always get the versionnumber of the page as a string (ajax) at loading. for example: www.yoursite.com/page/about?getVer=1&__[date]
Compare it to the stored versionnumber (stored in cookie or localStorage) if user has visited the page once, otherwise store it directly.
If version is not the same as local version, refresh the page using window.location.reload(true)
You will see any changes made on the page.

This method requires at least one request even when no request is needed because it already exists in the local browser cache. But the overhead is less comparing to using no cache at all (to be sure the page will show the right updated content). This requires just a few bytes for each page request instead of all content for each page.

IMPORTANT: The version info request must be implemented on your server otherwise it will return the whole page.

Example of version string returned by www.yoursite.com/page/about?getVer=1&__[date]: skg2pl-v8kqb

To give you an example in code, here is a part of my library (I don't think you can use it but maybe it gives you some idea how to do it):

o.gCheckDocVersion = function() // Because of the hard caching method, check document for changes with ajax 
{
  var sUrl = o.getQuerylessUrl(window.location.href),
      sDocVer = o.gGetData( sUrl, false );

  o.ajaxRequest({ url:sUrl+'?getVer=1&'+o.uniqueId(), cache:0, dataType:'text' }, 
                function(sVer)
                {
                   if( typeof sVer == 'string' && sVer.length )
                   {
                     var bReload = (( typeof sDocVer == 'string' ) && sDocVer != sVer );
                     if( bReload || !sDocVer )
                      { 
                        o.gSetData( sUrl, sVer ); 
                        sDocVer = o.gGetData( sUrl, false );
                        if( bReload && ( typeof sDocVer != 'string' || sDocVer != sVer ))
                         { bReload = false; }
                      }
                     if( bReload )
                      {  // Hard refresh page contents
                        window.location.reload(true); }
                   }
                }, false, false );
};

If you are using version independent resources like javascript or css files, add versionnumbers (implemented with a url rewrite and not with a query because they mostly won't be cached). For example: www.yoursite.com/ver-01/about.js

For me, this method is working great, maybe it can help you too.

score -6 · Answer 8 · edited Aug 29 '15 at 01:37

-6

try this working fine

jQuery("body").load(window.location.href);

edited Aug 29 '15 at 01:37

Anik Islam Abhi

25,137
8
58
80

answered Jul 26 '15 at 02:03

Muhammad Waqas

1,140
12
20

why down vote mr down vote ? – Muhammad Waqas Jun 26 '16 at 21:34
4

Probably because the OP asked for a Javascript method and you provided a JQuery method – Barry Michael Doyle Jul 25 '16 at 13:41
4

In addition to being super inefficient, it doesn't even refresh the page... – Emile Bergeron Oct 31 '17 at 23:44

Refresh a page using JavaScript or HTML

8 Answers8

Linked

Related