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

一个新手
Libérer: 2017-09-07 15:02:50
original
1749 Les gens l'ont consulté

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>
Copier après la connexion

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>
Copier après la connexion


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>
Copier après la connexion

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
Copier après la connexion

2. Actualiser automatiquement la page . 1. Actualisez automatiquement la page : Ajoutez le code suivant dans la zone

Le 20 signifie actualiser la page tous les 20. secondes
2. La page saute automatiquement : ajoutez le code suivant dans la zone

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>
Copier après la connexion

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>");
Copier après la connexion

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>
Copier après la connexion

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

复制代码 代码如下:

<script language=JavaScript> 
    self.opener.location.reload(); 
</script>
Copier après la connexion


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();
Copier après la connexion


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

<body onload="opener.location.reload()"> 
开窗时刷新 
<body onUnload="opener.location.reload()"> 
关闭时刷新
Copier après la connexion


复制代码 代码如下:

<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";
Copier après la connexion

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal