Maison > interface Web > js tutoriel > le corps du texte

Explication détaillée de la façon de trouver des éléments dans iframe à l'aide de jquery

php中世界最好的语言
Libérer: 2018-04-26 10:42:59
original
1336 Les gens l'ont consulté

Cette fois, je vais vous apporter une explication détaillée de la méthode jquery pour trouver des éléments dans une iframe. Quelles sont les précautions pour trouver des éléments dans une iframe avec jquery ? un cas pratique, jetons un coup d'oeil.

Question :

Aujourd'hui, dans l'entreprise, nous avons ajouté une fonction de titre d'image "si afficher" à ckeditor

Difficulté :

Le plug-in a beaucoup de contenu et des fonctions très puissantes. Il est impossible de lire et de comprendre les relations logiques à l'intérieur en peu de temps. De plus, le contenu modifié ne peut pas détruire les relations logiques internes de. le plug-in, et ne peut pas en introduire davantage en ajoutant une fonction, ce problème ne peut donc être résolu que localement

Percée :

Lorsque vous connaissez la page, utilisez l'iframeframe html inséré, la page en a La fonction d'initialisation est terminée ici, ajoutez donc ce composant de case à cocher ici, puis recherchez le objet fenêtre que vous souhaitez traiter en fonction du final window - window.parent.document .body

jQuery(expression, [context]) - Si le paramètre de contexte est spécifié, comme un ensemble d'éléments DOM ou un objet jQuery, il sera recherché dans ce contexte.

L'exemple suivant consiste à ajouter un composant à la fenêtre parent d'une iframe

Copiez le code Le code est le suivant :

$( 'tr.cke_dialog_ui_hbox', parent.document.body).prepend('La description du titre de la photo est introduit dans le journal

Vous ne pouvez pas accéder aux composants ajoutés dynamiquement dans la fermeture, car les éléments de la fermeture ont déjà été exécutés lors du chargement de la page, mais le composant avec l'ID kkkk a n'a pas été ajouté à la page. Utilisation La valeur obtenue par $("#kkkk") sera vide, ce qui ne pourra pas atteindre l'objectif attendu et une erreur de script sera signalée dans le navigateur

. Comment juger si jquery trouve une correspondance qui correspond à l'objet de la condition ?

if(0==$(".check_show_img_title", parent.document.body).length){
   alert("没有查找到对象");
}else{
  alert("有"+$(".check_show_img_title", parent.document.body).length+"组件符合查询条件");
}
Copier après la connexion

Expérience :

Après l'ajout dynamique de composants à la page, l'état d'initialisation normal est restauré en actualisant la page, mais s'il s'agit d'un actualisation partielle et plusieurs composants peuvent être ajoutés. Cependant, si un seul composant est nécessaire, le composant ajouté dynamiquement sera supprimé en quittant la page. Cela entraînera un problème dans différents navigateurs, il le sera donc. très déprimant et causer des problèmes de compatibilité du navigateur. Puisque c'est le cas, vous pouvez changer votre façon de penser et l'ajouter dans un certain état (en ajoutant des attributs à la balise), sinon il ne sera pas ajouté, vous n'êtes donc pas obligé de le faire. supprimez-le et ajoutez-le vous-même, une autre façon de résoudre le problème de compatibilité du navigateur

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres éléments connexes. articles sur le site PHP chinois !

Lecture recommandée :

Explication détaillée des étapes pour obtenir l'objet document dans iframe

Comment gérer la page échec d'ancrage dans iframe

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