Javascript Reload Page

Solution 1:

Try using location.reload(false).

As MDN says, the second parameter is a boolean indicating whether to bypass the cache or not. false keeps using the cache, as you wanted.

Solution 2:

icktoofay explains the workaround so I'm just addressing this question:

However, this doesn't work for some reason when there is anchor text. It appears to do nothing in this case, but more likely it refreshes the anchor.

HTML 5 describes the Location interface which covers assignment to document.location.

When the assign(url) method is invoked, the UA must resolve the argument, relative to the entry script's base URL, and if that is successful, must navigate the browsing context to the specified url.

So the navigate operation only sees an absolute URL, so there is no difference assigning just a fragment vs assigning an absolute URL that is the same as the page URL with a fragment.

navigate

8 Fragment identifiers: Apply the URL parser algorithm to the absolute URL of the new resource and the address of the active document of the browsing context being navigated. If all the components of the resulting parsed URLs, ignoring any fragment components, are identical, and the new resource is to be fetched using HTTP GET or equivalent, and the parsed URL of the new resource has a fragment component that is not null (even if it is empty), then navigate to that fragment identifier and abort these steps.

Finally, navigating to a fragment identifier says

When the user agent is required to scroll to the fragment identifier, it must either change the scrolling position of the document using the scroll an element into view algorithm defined in the CSSOM View specification, with the align to top flag set, or perform some other action, such that the indicated part of the document is brought to the user's attention.

Solution 3:

The best way to be completely sure the page itself is reloaded, but the other cached elements are not is to change the location.search query string with a random parameter.

For example,

location.search='?'+Math.random();

The cached is not bypassed, so all elements of the page will be loaded from cache, but the main page itself is forced to reload because HTTP requires another request to the server for each unique query string / location.search value.

If your page is itself an application which uses a query string (like file.cgi?param=xyz&param2=abc...) then you will have to append to the query string rather than replace it completely:

if (location.search.length > 1)
location.search+='&'+Math.random();
else
location.search='?'+Math.random();