jQuery ruft das Iframe-Element ab-js-Tutorial-php.cn

jQuery ruft das Iframe-Element ab

php中世界最好的语言

Freigeben： 2018-04-26 10:33:28

Original

5608 Leute haben es durchsucht

Dieses Mal bringe ich Ihnen jQuery zum Abrufen von Iframe-Elementen. Was sind die Vorsichtsmaßnahmen für jQuery zum Abrufen von Iframe-Elementen?

Mehrere Möglichkeiten, Elemente in Iframe mit JQuery abzurufen:

Übergeordnete Seitenelemente auf Iframe-Unterseiten abrufen

Der Code lautet wie folgt:

$(&#39;#objId&#39;, parent.
document
);

Nach dem Login kopieren

Fertig...

Elemente der Iframe-Unterseite auf der übergeordneten Seite abrufen:

$("#objid",document.frames(&#39;iframename&#39;).document)
$(document.getElementById(&#39;iframeId&#39;).contentWindow.document.body).html()

Nach dem Login kopieren

Zeigt den Inhalt des Body-Elements im Iframe an.

$("#testId", document.frames("iframename").document).html();

Nach dem Login kopieren

Rufen Sie das Element ab, dessen ID „testId“ ist, basierend auf iframename

$(window.frames["iframeName"].document).find("#testId").html()

Nach dem Login kopieren

Verwenden Sie JS oder jQuery, um auf den Iframe auf der Seite zuzugreifen, kompatibel mit IE/FF

Hinweis: Seiten innerhalb des Frames können nicht domänenübergreifend sein!

Angenommen, es gibt zwei Seiten in derselben Domäne 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>

Nach dem Login kopieren

iframe.html-Inhalt:

<!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>
<p id="test">www.jb51.net</p>
</body>
</html>

Nach dem Login kopieren

1. Führen Sie JS in index.html aus, um direkten Zugriff zu erhalten:

document.getElementById(&#39;koyoz&#39;).contentWindow.document.getElementById(&#39;test&#39;).style.color=&#39;red&#39;

Nach dem Login kopieren

Zugriff auf die ID mit dem Namen „koyoz“ im Index. HTML-Iframe-Seite, rufen Sie das Objekt mit der ID „test“ auf dieser Iframe-Seite ab und setzen Sie seine Farbe auf Rot.

Dieser Code wurde getestet und kann IE/Firefox unterstützen.

2. Verwenden Sie jQuery, um auf index.html zuzugreifen:

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

Nach dem Login kopieren

Die Wirkung dieses Codes ist die gleiche wie beim direkten JS-Zugriff. Aufgrund des jQuery-Frameworks ist der Code kürzer.

Sammeln Sie einige Beispiele aus dem Internet:

Die Verwendung von jQuery zum Abrufen des Werts eines Elements des übergeordneten Fensters in IFRAME kann nur durch die Kombination der DOM-Methode und der JQuery-Methode erreicht werden

1. Bedienen Sie das übergeordnete Fenster, um alle Optionsfelder im IFRAME auszuwählen

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

Nach dem Login kopieren

2. Bedienen Sie das Bedienelement im IFRAME, um alle Optionsfelder im übergeordneten Fenster auszuwählen

$(window.parent.document).find("input:radio").attr("checked","true");

Nach dem Login kopieren

Das übergeordnete Fenster möchte Um den Iframe im IFrame zu erhalten, fügen Sie einfach eine Frames-Unterebene hinzu, z. B.:

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

Nach dem Login kopieren

Ich glaube, Sie haben die Methode gemeistert, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie hier Weitere verwandte Artikel auf der chinesischen PHP-Website!

Empfohlene Lektüre:

jQuery ist die einfachste Implementierung des Tab-Option-Wechsels

jQuery+Ajax implementiert die Titelsortierung von Tabellendaten

Das obige ist der detaillierte Inhalt vonjQuery ruft das Iframe-Element ab. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!