code d'implémentation js pour déterminer si des éléments dans iframe existent-js tutoriel-php.cn

code d'implémentation js pour déterminer si des éléments dans iframe existent

高洛峰

Libérer： 2017-01-12 11:00:48

original

1383 Les gens l'ont consulté

Cet article vous présentera js pour déterminer si l'élément dans l'iframe existe du code. Les amis qui ont besoin d'en savoir plus peuvent le saisir pour référence.

1. La méthode d'implémentation js originale pure, le code est le suivant :

<script>
var bb = document.getElementById(&#39;PreviewArea&#39;).contentWindow.document.getElementById(&#39;aPic&#39;);
if( bb )
{
}
else
{
}
//apic为子页面Preview.aspx里面元素的Id
</script>
<body>
<iframe name="PreviewArea" id="PreviewArea" scrolling="yes" width="100%" height="290" frameborder="1" src="Preview.aspx"></iframe>
</body>

Copier après la connexion

2 La méthode d'implémentation jquery désormais populaire, le code est le suivant. :

if($(window.frames["iframepage"].document).find(&#39;.l-grid-row-cell&#39;).length > 0){ 
　　alert(1);
}else{
　　alert(2);
}

Copier après la connexion

Le code ci-dessus détermine si l'élément avec le CSS de 1-grid-row-cell dans l'iframe avec l'identifiant de iframepage existe.
Ci-joint

Plusieurs méthodes de Jquery pour obtenir des éléments dans iframe
Obtenir les éléments de la page parent dans les sous-pages iframe

$(&#39;#objId&#39;, parent.document);
// 搞定...
在父页面 获取iframe子页面的元素
  
$("#objid",document.frames(&#39;iframename&#39;).document)
$(document.getElementById(&#39;iframeId&#39;).contentWindow.document.body).html()

Copier après la connexion

Afficher le contenu de l'élément body dans l'iframe

$("#testId", document.frames("iframename").document).html();
根据iframename取得其中ID为"testId"元素
  
$(window.frames["iframeName"].document).find("#testId").html()

Copier après la connexion

2. Utilisez JS ou jQuery pour accéder à l'iframe dans la page, compatible avec IE /FF
Remarque : les pages dans le cadre ne peuvent pas traverser les domaines !
Supposons qu'il y ait deux pages sous le même domaine.
Le fichier index.html contient un iframe :

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>页面首页</title>
</head>
<body>
<iframe src="iframe.html" id="koyoz" height="0" width="0"></iframe>
</body>
</html>

Copier après la connexion

Contenu iframe.html :

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>iframe.html</title>
</head>
<body>
<div id="test">www.php.cn</div>
</body>
</html>

Copier après la connexion

1. Exécutez JS dans index.html pour un accès direct :

document.getElementById('koyoz' ).contentWindow.document .getElementById('test').style.color='red'

Accédez à la page iframe avec le nom d'ID 'koyoz' dans index.html, et obtenez la page iframe avec l'ID nommez l'objet 'test' et définissez sa couleur sur rouge
Ce code a été testé et peut prendre en charge IE/Firefox.
2. Accès avec jQuery dans index.html :

$("#koyoz").contents().find("#test").css('color','red') ;

L'effet de ce code est le même que celui de l'accès direct JS Grâce à l'aide du framework jQuery, le code est plus court.
De plus, certains internautes ont fourni les exemples suivants :
Utiliser jQuery dans Pour obtenir la valeur d'un élément de la fenêtre parent dans IFRAME, nous devons utiliser la combinaison de la méthode DOM et de la méthode jquery.

1. Sélectionnez tous les boutons radio de l'IFRAME dans la fenêtre parent

$(window.frames["iframe1"].document).find("input:radio"). "checked","true");
2. Sélectionnez tous les boutons radio de la fenêtre parent dans l'IFRAME

$(window.parent.document).find("input:radio ").attr ("checked","true");
Si la fenêtre parent souhaite obtenir l'Iframe dans l'IFrame, ajoutez simplement un cadre enfant, tel que :

$(window.frames[ "iframe1" ].frames["iframe2"].document).find("input:radio").attr("checked","true")

Plus de js pour déterminer si des éléments dans iframe existent Pour les articles liés à code d'implémentation, veuillez faire attention au site Web PHP chinois !