En regardant le site Web actuel, la vitesse d'Internet est un peu lente, mais presque chaque page contient de nombreux éléments similaires tels que des bannières, des images de colonnes, des droits d'auteur, etc. Bien sûr, en raison de la nécessité d'un style de site Web et d'un effet publicitaire unifiés , il n'y a rien de mal à cela. Mais après tout, les portefeuilles des utilisateurs sont de plus en plus vidés de leur argent par ces choses « embellies ». Existe-t-il un moyen d'empêcher que ces choses similaires soient téléchargées à nouveau après les avoir téléchargées une fois, et de ne télécharger que le fichier. du contenu web dans des domaines où le contenu a changé ?
La réponse est définitivement : appliquez la balise Iframe !
1. Utilisation des balises Iframe
En ce qui concerne Iframe, vous l'avez peut-être déjà jeté dans le "coin oublié", mais en ce qui concerne son frère Frame, vous ne serez pas étranger. La balise Frame est une balise frame Ce que nous appelons une structure multi-frame consiste à afficher plusieurs fichiers HTML dans une fenêtre de navigateur. Or, nous sommes confrontés à une situation très réaliste : s'il existe un tutoriel, il est divisé en sections une à une. A la fin de chaque page, il y a des liens vers la « section précédente » et la « section suivante », sauf que le contenu de celle-ci. chaque tutoriel est différent. De plus, le contenu des autres parties de la page est le même. Cela semble trop ennuyeux de créer des pages stupides page par page, j'ai soudain pensé, s'il existe un moyen de conserver d'autres parties de la page. la page inchangée, il suffit de transformer le tutoriel en un seul La page de contenu page par page ne contient pas d'autre contenu. Lorsque vous cliquez sur le lien page haut ou bas, seule la partie contenu du didacticiel sera modifiée, et les autres parties resteront inchangées. l'autre est que si le didacticiel comporte trois changements longs et deux courts dans le futur, il sera également très pratique et n'affectera pas l'ensemble de l'armée, plus important encore, la bannière publicitaire, la liste des colonnes, la navigation et d'autres choses ; sont inclus dans presque toutes les pages et ne peuvent être téléchargés qu'une seule fois, puis ne sont plus téléchargés.
Balise Iframe, également appelée balise de cadre flottant, vous pouvez l'utiliser pour intégrer un document HTML dans un affichage HTML. La plus grande caractéristique qui diffère de la balise Frame est que le fichier HTML référencé par cette balise n'est pas affiché indépendamment des autres fichiers HTML, mais peut être directement incorporé dans un fichier HTML et intégré au contenu du fichier HTML pour devenir un tout. De plus, vous pouvez également afficher le même contenu plusieurs fois sur une page sans avoir à écrire le contenu à plusieurs reprises. Une métaphore frappante est celle de la télévision « image dans l'image ».
Parlons maintenant de l'utilisation des balises Iframe.
Le format d'utilisation de la balise Iframe est :
<Iframe src="URL" width="x" height="x" scrolling="[OPTION]" frameborder="x"></iframe>
src : Le chemin du fichier, qui peut être un fichier HTML, texte, ASP, etc. ;
width, height : la largeur et la hauteur de la zone « image dans l’image » ;
défilement : Lorsque le fichier HTML spécifié de SRC n'est pas affiché dans la zone spécifiée, l'option de défilement, si elle est définie sur NON, la barre de défilement n'apparaîtra pas si elle est Auto : la barre de défilement apparaîtra automatiquement si elle est Oui ; il sera affiché ;
FrameBorder : La largeur de la bordure de la zone afin de mélanger "l'image dans l'image" avec le contenu adjacent, elle est souvent définie sur 0.
Par exemple:
<Iframe src="http://netschool.cpcw.com/homepage" width="250" height="200" scrolling="no" frameborder="0"></iframe>
2. Contrôle mutuel entre le formulaire parent et le cadre flottant
Dans le langage de script et la hiérarchie des objets, la fenêtre contenant l'Iframe est appelée formulaire parent et le cadre flottant est appelé formulaire enfant. Il est important de comprendre la relation entre les deux, car la fenêtre enfant doit être accessible dans le parent. formulaire. La hiérarchie des objets doit être connue avant qu’un formulaire puisse être consulté et contrôlé par programme, ou vice versa.
1. Accéder et contrôler les objets du sous-formulaire du formulaire parent <br/> Dans le formulaire parent, l'Iframe, c'est-à-dire le sous-formulaire, est un objet enfant de l'objet document. Vous pouvez accéder directement aux objets du sous-formulaire dans. l'objet du script.
Maintenant, il y a une question, c'est-à-dire comment contrôler cet Iframe ? Ici, nous devons parler de l'objet Iframe. Lorsque nous définissons l'attribut ID sur cette balise, nous pouvons effectuer une série de contrôles sur le HTML contenu dans l'Iframe via le DOM Document Object Model.
Par exemple, intégrez le fichier test.htm dans example.htm et contrôlez certains objets balises dans test.htm :
<Iframe src="test.htm" id="test" width="250" height="200" scrolling="no" frameborder="0"></iframe>
Le code du fichier test.htm est :
<html>
<corps>
<h1 id="myH1">Bonjour, mon garçon</h1>
</corps>
</html>
Si nous voulons changer le texte de la balise H1 avec le numéro d'identification myH1 en bonjour, ma chère, nous pouvons utiliser :
document.myH1.innerText="bonjour, mon cher" (le document peut être omis)
Dans le fichier example.htm, le sous-formulaire pointé par l'objet de marque Iframe est cohérent avec le modèle objet DHTML général et la méthode de contrôle d'accès aux objets est la même, je n'entrerai donc pas dans les détails.
2. Accéder et contrôler les objets du formulaire parent dans le formulaire enfant <br/> Dans le formulaire enfant, nous pouvons accéder aux objets de la fenêtre parent via son objet parent (parent).
Tel que exemple.htm :
<html>
<body onclick="alert(tt.myH1.innerHTML)">
<Iframe name="tt" src="frame1.htm" width="250" height="200" scrolling="no" frameborder="0"></iframe>
<h1 id="myH2">bonjour, ma femme</h1>
</corps>
</html>
Si nous voulons accéder au texte du titre dans frame1.htm avec le numéro d'identification myH2 et le changer en "bonjour, mon ami", nous pouvons écrire comme ceci : parent.myH2.innerText="bonjour, mon ami"
Ici l'objet parent représente le formulaire courant (le formulaire où se trouve exemple.htm). Pour accéder aux objets du formulaire parent dans le formulaire enfant, sans exception, cela se fait via l'objet parent.
Bien qu'Iframe soit intégré dans un autre fichier HTML, il reste relativement indépendant et constitue un « royaume indépendant ». Les caractéristiques d'un seul HTML s'appliquent également aux frames flottants.
Imaginez simplement, grâce à la balise Iframe, nous pouvons exprimer le contenu inchangé sous forme d'Iframe, de cette façon, nous n'avons pas besoin d'écrire le même contenu à plusieurs reprises. C'est un peu comme un processus ou une fonction de programmation, et combien de manuel fastidieux. le travail est économisé ! De plus, et surtout, cela rend les modifications de page plus réalisables, car au lieu de devoir modifier chaque page pour ajuster la mise en page, il vous suffit de modifier la mise en page d'un formulaire parent.
Une chose à noter est que le navigateur Nestscape ne prend pas en charge la balise Iframe, mais dans le monde actuel d'IE, cela ne semble pas être un gros problème. Les balises Iframe sont largement utilisées, pas seulement pour elles-mêmes (le site Web), mais aussi pour les internautes d'économiser sur les frais Internet. Pourquoi pas ?