Refresh a page using JavaScript or HTML

JavascriptHtmlPage Refresh

Javascript Problem Overview


How can I refresh a page using JavaScript or HTML?

Javascript Solutions


Solution 1 - Javascript

window.location.reload(); in JavaScript

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

Solution 2 - Javascript

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

Solution 3 - Javascript

simply use..

location.reload(true/false);

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

Solution 4 - Javascript

window.location.reload()

should work however there are many different options like:

window.location.href=window.location.href

Solution 5 - Javascript

You can also use

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

It works fine for me.

Solution 6 - Javascript

Use:

window.location.reload();

Solution 7 - Javascript

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.

Solution 8 - Javascript

try this working fine

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

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionPrabakaranView Question on Stackoverflow
Solution 1 - JavascriptReidView Answer on Stackoverflow
Solution 2 - JavascriptepochView Answer on Stackoverflow
Solution 3 - JavascriptWolv3rineView Answer on Stackoverflow
Solution 4 - JavascriptMike LewisView Answer on Stackoverflow
Solution 5 - JavascriptMandeep SinghView Answer on Stackoverflow
Solution 6 - JavascriptRobView Answer on Stackoverflow
Solution 7 - JavascriptCodebeatView Answer on Stackoverflow
Solution 8 - JavascriptMuhammad WaqasView Answer on Stackoverflow