recherche

Maison >interface Web >js tutoriel >Plusieurs méthodes d'actualisation de page en utilisant javascript

Plusieurs méthodes d'actualisation de page en utilisant javascript

一个新手
一个新手original
2017-09-07 15:02:501748parcourir

Plusieurs méthodes d'actualisation de page JavaScript

Ce qui suit est un exemple de trois pages nommées frame.html, top.html et bottom.html Soyez précis. sur la façon de le faire.
frame.html se compose de deux pages : top (top.html) et bottom (bottom.html). Le code est le suivant :

<.>Copier le code Le code est le suivant :

<!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>

Supposons maintenant que top.html ( c'est-à-dire la page ci-dessus) a sept boutons pour actualiser bottom.html (c'est-à-dire la page ci-dessous), vous pouvez utiliser les sept instructions suivantes, à vous de décider laquelle est la plus facile à utiliser. Le code de la page top.html est le suivant :

Code Le code est le suivant : 

<!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[&#39;bottom&#39;].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(&#39;bottom&#39;).location.reload()"><br>
<input type=button value="刷新6" onclick="window.parent.bottom.location.reload()"><br>
<input type=button value="刷新7" onclick="window.parent[&#39;bottom&#39;].location.reload()"><br>
</BODY> 
</HTML>


Ce qui suit est le code source de la page bottom.html Afin de prouver que la page ci-dessous a effectivement. a été actualisée, une boîte de dialogue apparaît après le chargement de la page.

Copier le code Le code est le suivant : 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML> 
    <HEAD> 
        <TITLE> bottom.html </TITLE> 
    </HEAD> 
<BODY onload="alert(&#39;我被加载了！&#39;)"> 
    <h1>This is the content in bottom.html.</h1> 
</BODY> 
</HTML>

Expliquez :
Copiez le codeLe code est le suivant :

1.window fait référence à la page actuelle, par exemple, dans cet exemple, il fait référence à la page top.html. 2.parent fait référence à la page parent de la page actuelle, qui est la page cadre qui la contient. Par exemple, pour cet exemple, il fait référence à framedemo.html.
3.frames est un objet fenêtre et un tableau. Représente toutes les sous-pages dans le cadre.
4.item est une méthode. Renvoie les éléments du tableau.
5. Si la sous-page est également une page cadre avec d'autres sous-pages à l'intérieur, certaines des méthodes ci-dessus peuvent ne pas fonctionner.
Pièce jointe :
Plusieurs façons d'actualiser la page en utilisant Javascript : 

1 history.go(0) 
2 location.reload() 
3 location=location 
4 location.assign(location) 
5 document.execCommand(&#39;Refresh&#39;) 
6 window.navigate(location) 
7 location.replace(location) 
8 document.URL=location.href

2. Actualiser automatiquement la page . 1. Actualisez automatiquement la page : Ajoutez le code suivant dans la zone 93f0f5c25f18dab9d176bd4f6de5d30e
cbc445b94b07fca83f8f029a735ab635
Le 20 signifie actualiser la page tous les 20. secondes
2. La page saute automatiquement : ajoutez le code suivant dans la zone 93f0f5c25f18dab9d176bd4f6de5d30e
7dcbe7499079ae0101f7caa4950e4e6b
Les 20 doigts passeront à la page http://www.jb51.net après 20 secondes
3. La page actualise automatiquement la version js 

<script language="JavaScript">
function myrefresh() 
{ 
window.location.reload(); 
} 
setTimeout(&#39;myrefresh()&#39;,1000); //指定1秒刷新一次 
</script>

3. Lors de l'écriture de Servler, Action et d'autres programmes en Java, vous devez utiliser la page de retour (par exemple, si la fenêtre est ouverte, une fois l'opération terminée, fermer la page actuelle et actualiser la page parent)

Copier le code Le code est la suivante :

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>");

4. Instruction de script d'actualisation du cadre JS1 Comment actualiser la page contenant le cadre avec
<.>

Copier le code Le code est le suivant :

<script language=JavaScript> 
    parent.location.reload(); 
</script>

2. La fenêtre enfant actualise la fenêtre parent

复制代码 代码如下:

<script language=JavaScript> 
    self.opener.location.reload(); 
</script>


3.如何刷新另一个框架的页面用 （上面的实例以说明了）

复制代码 代码如下:

语句1. window.parent.frames[1].location.reload(); 
语句2. window.parent.frames.bottom.location.reload(); 
语句3. window.parent.frames["bottom"].location.reload(); 
语句4. window.parent.frames.item(1).location.reload(); 
语句5. window.parent.frames.item(&#39;bottom&#39;).location.reload(); 
语句6. window.parent.bottom.location.reload(); 
语句7. window.parent[&#39;bottom&#39;].location.reload();


4.如果想关闭窗口时刷新或者想开窗时刷新的话，在6c04bd5ca3fcae76e30b72ad730ca86d中调用以下语句即可。

<body onload="opener.location.reload()"> 
开窗时刷新 
<body onUnload="opener.location.reload()"> 
关闭时刷新


复制代码 代码如下:

<script language="javascript"> window.opener.document.location.reload() 
</script> 
 
JavaScript 实现页面跳转的几种方法：
window.location.href="new.jsp?msg=&#39;hello";
self.location=&#39;new.jsp?pam=&#39;omg&#39;;
window.navigate("new.jsp") ;
top.location="show.jsp";

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent：Explication détaillée d'exemples de fonction load() dans l'application ajax dans jqueryArticle suivant：Explication détaillée d'exemples de fonction load() dans l'application ajax dans jquery

Articles Liés

Voir plus