La fonction de l'élément iframe est d'intégrer un document dans un document et de créer un cadre flottant. Beaucoup de gens ne comprennent pas très bien comment l'iframe est contrôlé, et ils en sont encore dans un vague état de compréhension.
Deux remarques sur les iframes, ifr est l'ID et la valeur NAME d'une iframe existante :
Ce qui suit est un fragment cité :
document.getElementById("ifr");
window.frames[«ifr»];
deuxième
méthode car elle prend un modèle DOM complet (je ne sais pas si c'est correct, la première méthode supprime simplement un OBJET).
je veux seulement Pour modifier le src ou la bordure de l'iframe, le défilement et d'autres attributs (qui ne sont pas le même concept que la propriété, la propriété ne peut pas être écrite dans des balises, telles que : scrollHeight, innerHTML, etc.), vous devez utiliser la première méthode.
Si vous souhaitez obtenir la page de l'iframe (et non l'iframe elle-même), vous devez utiliser la deuxième méthode, car elle obtient un modèle DOM complet. Par exemple, si vous souhaitez obtenir le contenu du document.body du. iframe, vous ne pouvez utiliser que la deuxième méthode.
Notez également que si la page iframe n'est pas complètement chargée, une erreur grave se produira lors de l'appel du modèle DOM de l'iframe. Vous devez donc préparer un mode de tolérance aux pannes
. , l'un est aa.htm et l'autre est bb.htm !
Codeaa .htm
: Ce qui suit est un fragment de citation :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<html xmlns=" http://www.w3.org/1999/xhtml " >
<tête>
<title>Page sans titre</title>
<style type="text/css">
<!--
corps{
marge : 0px ;
}
-->
</style>
</tête>
<corps>
<iframe id="ifr" name="ifr" width="100%" height="500" src="bb.htm"></iframe>
</corps>
</html>
<langage de script="javascript" type="text/javascript">
var aa_value="Je suis une variante dans la fenêtre supérieure !";
var ifr_id=document.getElementById("ifr");
var ifr_window=window.frames["ifr"];
alert("Alerte de la fenêtre supérieure : Impossible d'obtenir la variante de l'iframe par ifr_id, elle retournera :" + ifr_id.bb_var);
alert("Alerte de la fenêtre supérieure : Impossible d'obtenir le modèle DOM de l'iframe par ifr_id, il renverra :" + ifr_id.window);
alert("Alerte de la fenêtre supérieure : Obtenez le src à partir de l'identifiant :" + ifr_id.src);
alert("Alerte depuis la fenêtre supérieure : Obtenez le href depuis la fenêtre :" + ifr_window.document.location.href);
//Étant donné que bb.htm n'est peut-être pas encore chargé, le téléchargement peut provoquer une erreur.
//Appelle la fonction ifr_window.bb() dans l'iframe ;
//Appelle les variables dans l'iframe
alert("Alerte de la fenêtre supérieure : " + ifr_window.bb_var);
//
alert("Alerte depuis la fenêtre supérieure :" + ifr_window.document.body.innerHTML);
fonction aa(msg){
alert("Je vous alerte depuis la fenêtre supérieure et j'ai reçu un msg :n" + msg);
}
</script>
bb.htm
Code : ce qui suit est un extrait cité :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<html xmlns=" http://www.w3.org/1999/xhtml " >
<tête>
<title>sous-cadre</title>
<style type="text/css">
<!--
html,corps{
marge : 0px ;
largeur : 90 % ;
}
-->
</style>
</tête>
<corps>
Je suis un sous-cadre !
<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...<br />
...
</corps>
</html>
<langage de script="javascript" type="text/javascript">
var bb_var="Je suis une variable en ifr";
fonctionbb(){
alert("Alerte depuis iframe : je suis la fonction frame ifr")
}
//Récupère les variables de la page parent
alert("Alerte de l'iframe parent.ifr_id::" + parent.ifr_id);
alert("Alerte de l'iframe parent.aa_value : " + parent.aa_value);
//Modifie la hauteur de l'iframe via l'ifr_id de la page parent
alert("Alerte de l'iframe : clientHeight de l'ifr :" +document.body.clientHeight);
parent.ifr_id.height=document.body.clientHeight;
alert("Alerte depuis iframe : ifr's scrollHeight : " + document.body.scrollHeight);
//Appelle la fonction du formulaire parent :
parent.aa("Je vais appeler une fonction qui est celle de la fenêtre supérieure ");
//Change le titre du formulaire parent :
alert("Alerte depuis iframe : je vais changer le titre de la fenêtre supérieure");
top.document.title="La valeur du titre a changé";
//La bordure et le défilement ont changé via l'ifr_id du formulaire parent
alert("Alerte depuis iframe : je vais changer ma bordure et mon défilement :");
top.ifr_id.border=0;
top.ifr_id.scrolling="non";
</script>