Maison > interface Web > js tutoriel > Comment puis-je accéder et manipuler l'iframe parent à partir d'un cadre enfant encapsulé en JavaScript ?

Comment puis-je accéder et manipuler l'iframe parent à partir d'un cadre enfant encapsulé en JavaScript ?

Barbara Streisand
Libérer: 2024-11-06 07:47:02
original
220 Les gens l'ont consulté

How can I access and manipulate the parent iframe from within a JavaScript-encapsulated child frame?

Accès à l'Iframe parent à partir de JavaScript

Encapsulées dans les applications Web, les iframes servent de conteneurs isolés pour le contenu intégré. Cependant, accéder aux informations de l'iframe parent peut être un défi. Cet article de blog explore les méthodes permettant d'accéder à l'iframe parent et de manipuler son contenu à partir de JavaScript.

Énoncé du problème

Nous avons un scénario dans lequel plusieurs iframes générées dynamiquement existent sur une page. Chaque iframe charge une page identique. Notre objectif est de fermer par programme une iframe spécifique. Pour y parvenir, nous devons identifier l'iframe parent à partir de la page chargée.

Solution

Pour accéder à l'iframe parent, nous pouvons utiliser l'approche suivante :

  1. Attribuer des attributs de nom et d'ID : Donnez à l'iframe et à son parent un nom et un identifiant identiques. Cela nous permet d'identifier de manière unique l'iframe dans les deux contextes.
<iframe>
Copier après la connexion
  1. Accès à l'aide de JavaScript : Dans la page enfant chargée, utilisez le code JavaScript suivant pour récupérer l'iframe parent :
parent.document.getElementById(window.name);
Copier après la connexion

Ce code récupère l'élément iframe avec l'ID correspondant à la propriété name de la page enfant, que nous avons définie pour être identique à son parent.

Avec ceci méthode, vous pouvez maintenant manipuler l'iframe parent selon vos besoins, par exemple en le fermant ou en modifiant son contenu.

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!

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
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal