JavaScript refresh page special effect code

There are many methods to refresh the page in js, such as reload (), loaction, location. href, which can achieve the page refresh effect. Let's take a look at these methods.

It is usually used in web development. There are more than one method. How many methods have you mastered?

Common page refresh Methods

History. go (0)
Location. reload ()
Location = location
Location. assign (location)
Document.exe cCommand ('refresh ')
Window. navigate (location)
Location. replace (location)
Document. URL = location. href

Today, in the project, the chrome refresh page is invalid. After repeated tests, it is found that the "#" character is used to prevent page refresh.
Don't you understand? Let's take a look at the demo.

The Code is as follows:

Copy code

// Javascript $ (Function (){ $ ('# Reload'). show ('low '); $ ('# O1'). click (function (){ Location = location }) $ ('# O2'). click (function (){ History. go (0) }) $ ('# O3'). click (function (){ Location. reload () }) $ ('# O4'). click (function (){ Location = location }) $ ('# O5'). click (function (){ History. go (0) }) $ ('# O6'). click (function (){ Location. reload () }) $ ('# O7'). click (function (){ Window. location = window. location Return false }) $ ('# O8'). click (function (){ History. go (0) Return false }) $ ('# O9'). click (function (){ Location. reload () Return false }) }) // Html <Div id = "reload"> page refreshed </div> <A href = "#" id = "o1"> Example 1 </a> <A href = "#" id = "o2"> Example 2 </a> <A href = "#" id = "o3"> Example 3 </a> <A href = "javascript:;" id = "o4"> Example 4 </a> <A href = "javascript:;" id = "o5"> Example 5 </a> <A href = "javascript:;" id = "o6"> Example 6 </a> <A href = "#" id = "o7"> Example 7 </a> <A href = "#" id = "o8"> Example 8 </a> <A href = "#" id = "o9"> Example 9 </a>

Test Results

• Refresh all firefox examples normally
• Chrome Example 2 refreshing is invalid
• All opera examples are refreshed normally
• All IE examples are refreshed normally. Example 2 will add the "#" character in the address bar

This time, the "#" character is added to the address bar. The test result is as follows:

• Refresh in firefox Example 1, example 4, and Example 7 is invalid, and other refreshes are normal
• Chrome Example 3, Example 6, and Example 9 are refreshed normally, and other refreshes are invalid
• Opera Example 1, example 4, and Example 7 are not refreshed properly.
• In IE Example 1, example 4, and Example 7, the refresh is invalid, and other refreshes are normal.

It seems that this is chrome's personality. Here we design the beehive to remind you to pay attention to the following two points:

1. Try to use "#" as the blank link and use javascript:; to replace it.
2. Use location. reload () to refresh the page only when appropriate. This method will forcibly clear the cache and increase the page loading time.

How to automatically refresh the page:

1. Automatically refresh the page: Add the following code to the

The Code is as follows:	Copy code
<Meta http-equiv = "refresh" content = "20">

20 indicates refreshing the page every 20 seconds.

2. automatic page Jump: Add the following code to the

The Code is as follows:	Copy code
<Meta http-equiv = "refresh" content = "20; url = http://www.bKjia. c0m">

20 means jump to the http://www.bKjia. c0m page every 20 seconds

3. Automatically refresh js version on the page

The Code is as follows:	Copy code
<Script language = "JavaScript"> Function myrefresh () { Window. location. reload (); } SetTimeout ('myrefresh () ', 1000); // refresh once per second </Script>

JS refresh framework script statement

// How to refresh the page containing the framework

The Code is as follows:	Copy code
<Script language = JavaScript> Parent. location. reload (); </Script>

// Refresh the parent window in the Child Window

The Code is as follows:	Copy code
<Script language = JavaScript> Self. opener. location. reload (); </Script> (Or <a href = "javascript: opener. location. reload ()"> refresh </a>) // How to refresh the page of another framework <Script language = JavaScript> Parent. Another FrameID. location. reload (); </Script>

If you want to refresh the window when closing the window or refresh the window when opening the window, you can call the following statement in <body>.

The Code is as follows:	Copy code
<Body onload = "opener. location. reload ()"> refresh when opening a window <Body onUnload = "opener. location. reload ()"> refresh when disabled <Script language = "javascript"> Zookeeper opener.doc ument. location. reload () </Script>