5 ways to refresh the current page in js
<div class="postBody">
<div id="cnblogs_post_body" class="blogpost-body"><p>1。 reload</p>
The reload method, which forces the browser to refresh the current page.
Syntax: location.reload([bForceGet])
Parameters: bForceGet, optional parameter, the default is false, get the current page from the client cache. true, then the latest page is fetched from the server in GET mode, which is equivalent to the client clicking F5 ("refresh")
The reload() method is used to reload the current document.
If the method does not specify parameters, or the parameter is false, it will use the HTTP header If-Modified-Since to detect whether the document has changed on the server. If the document has changed, reload() will download the document again. If the document has not changed, this method will load the document from the cache. This is exactly the same effect as when the user clicks the browser's refresh button.
2.
2. The replace method, which replaces the item currently cached in the history (client side) by specifying the URL, so after using the replace method, you cannot access the replaced URL through "forward" and "backward".
Syntax: location.replace(URL)
usually use: location.reload() or history.go(0) to do it.
This method is similar to the client's point of F5 to refresh the page, so when the page method=”post”, a “page expired” prompt will appear.
Because of the Session security protection mechanism.
When the location.reload() method is called, the aspx page already exists in the server memory, so it must be IsPostback.
If there is such an application: The page needs to be reloaded, that is to say, it is expected that the page can be recreated on the server side, and the expectation is Not IsPostback.
Here, location.replace() does the job. The replaced page is regenerated on the server side every time.
Code: location.replace(location.href); Go
back and refresh the page:
location.replace(document.referrer);
document.referrer //URL of previous page
Do not use history.go(-1), or history.back(); to go back and refresh the page, these two methods will not refresh the page.
Attached:
Several ways to refresh the page with Javascript:
1，history.go(0)
2，location.reload()
3，location=location
4，location.assign(location)
5，document.execCommand(‘Refresh’)
6，window.navigate(location)
7，location.replace(location)
8，document.URL=location.href
The method of automatically refreshing the page:
1. Automatically refresh the page: add the following code to the <head> area
<meta http-equiv=”refresh” content=”20”>
20 means that the page is refreshed every 20 seconds.
2, the page automatically jumps: add the following code to the <head> area
<meta http-equiv=”refresh” content=”20;url=http://www.jb51.net”>
Among them, 20 refers to jumping to http://www.jb51.net page
3 after 20 seconds, and the page automatically refreshes the js version
<script language=”JavaScript”>
function myrefresh()
{
window.location.reload();
}
setTimeout(‘myrefresh()’,1000); //指定1秒刷新一次
</script>
4. Script statement of JS refresh framework
//Refresh the page containing the frame with
<script language=JavaScript>
parent.location.reload();
</script>
//The child window refreshes the parent window
<script language=JavaScript>
self.opener.location.reload();
</script>
(or <a href=”javascript:opener.location.reload()”>refresh</a> )
//Refresh the page of another frame with
<script language=JavaScript>
parent.another FrameID.location .reload();
</script>
If you want to refresh when the window is closed or when the window is opened, you can call the following statement in <body>.
<body onload=”opener.location.reload()”> Refresh when opening window
<body onUnload=”opener.location.reload()”> Refresh when closing
<script language=”javascript”>
window.opener.document.location .reload()
</script>
1. Let's first look at a simple example:
the following three pages are named frame.html, top.html, bottom.html as an example to illustrate how to do it.
frame.html consists of two pages: top (top.html) and bottom (bottom.html). The code is as follows:
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.0 Transitional//EN”>
<HTML>
<HEAD>
<TITLE> frame </TITLE>
</HEAD>
<frameset rows=”50%,50%”>
<frame name=top src=”top.html”>
<frame name=bottom src=”bottom.html”>
</frameset>
</HTML>
Now suppose that top.html (that is, the page above) has seven buttons to refresh bottom.html (that is, the page below), you can use the following seven statements, which one is easy to use and see for yourself.
The code of the top.html page is as follows:
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.0 Transitional//EN”>
<HTML>
<HEAD>
<TITLE> top.html </TITLE>
</HEAD>
<BODY>
<input type=button value=”刷新1” onclick=”window.parent.frames[1].location.reload()”><br>
<input type=button value=”刷新2” onclick=”window.parent.frames.bottom.location.reload()”><br>
<input type=button value=”刷新3” onclick=”window.parent.frames[‘bottom’].location.reload()”><br>
<input type=button value=”刷新4” onclick=”window.parent.frames.item(1).location.reload()”><br>
<input type=button value=”刷新5” onclick=”window.parent.frames.item(‘bottom’).location.reload()”><br>
<input type=button value=”刷新6” onclick=”window.parent.bottom.location.reload()”><br>
<input type=button value=”刷新7” onclick=”window.parent[‘bottom’].location.reload()”><br>
</BODY>
</HTML>
The following is the source code of the bottom.html page. In order to prove that the page below is indeed refreshed, a dialog box pops up after the page is loaded.
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.0 Transitional//EN”>
<HTML>
<HEAD>
<TITLE> bottom.html </TITLE>
</HEAD>
<BODY onload=”alert(‘我被加载了！’)”>
<h1>This is the content in bottom.html.</h1>
</BODY>
</HTML>
explain:
1.window refers to the current page, for example, for this example it refers to the top.html page.
2.parent refers to the parent page of the current page, that is, the frame page that contains it. For example for this example it refers to framedemo.html.
3.frames is a window object, which is an array. Represents all subpages within the frame.
4.item is the method. Returns the elements in the array.
5. If the subpage is also a frame page with other subpages in it, then some of the above methods may not work.
Attachment:
Several methods for Javascript to refresh the page:
1 history.go(0)
2 location.reload()
3 location=location
4 location.assign(location)
5 document.execCommand('Refresh')
6 window.navigate(location)
7 location.replace(location)
8 document.URL=location.href
2. Automatically refresh the page
1. Automatically refresh the page: add the following code to the <head> area
<meta http-equiv=”refresh” content=”20”>
where 20 means to refresh the page every 20 seconds.
2. The page is automatically Jump: Add the following code to the <head> area
<meta http-equiv=”refresh” content=”20;url=http://www.jb51.net”>
where 20 means jump to http after 20 seconds ://www.jb51.net page
3. The page automatically refreshes the js version
[Ctrl+A to select all Note: If you need to introduce external Js, you need to refresh to execute ]
3. When java is writing programs such as Servler and Action, if it wants to operate the return page (such as talking about the window, after the operation is completed, close the current page and refresh the parent page)
1 PrintWriter out = response.getWriter();
2 out.write(“<script type=\”text/javascript\”>”);
3 ////子窗口刷新父窗口
4 out.write(“self.opener.location.reload();”);
5 //关闭窗口
6 out.write(“window.opener=null;”);
7 out.write(“window.close();”);
8 out.write(“</script>”);
Fourth, the script statement of the JS refresh frame
1. How to refresh the page containing the frame with
<script language=JavaScript>
parent.location.reload();
</script>
2. The child window refreshes the parent window
<script language=JavaScript>
self.opener.location.reload();
</script>
3. How to refresh the page of another frame with (the example above is illustrated)
Statement 1. window.parent.frames[1].location.reload();
Statement 2. window.parent.frames.bottom.location.reload();
Statement 3. window.parent.frames[“bottom”].location .reload();
Statement 4. window.parent.frames.item(1).location.reload();
Statement 5. window.parent.frames.item('bottom').location.reload();
Statement 6. window.parent.bottom.location.reload();
Statement 7. window.parent['bottom'].location.reload();
4. If you want to refresh when the window is closed or when the window is opened, you can call the following statement in <body>.
<body onload=”opener.location.reload()”>
Refresh when the window is
opened <body onUnload=”opener.location.reload()”>
Refresh when closed
<script language=”javascript”>
window.opener.document.location.reload()
</script>