jquery-Methode zum Betrieb von iframe_jquery

Werfen wir zunächst einen Blick auf die Hilfedatei für das Objekt content() in JQUERY

contents()
Übersicht
Suchen Sie alle untergeordneten Knoten (einschließlich Textknoten) innerhalb des passenden Elements. Wenn das Element ein Iframe ist, suchen Sie den Dokumentinhalt

Beispiel
Beschreibung:
Suchen Sie alle Textknoten und fetten Sie

ein

HTML

Code kopieren Der Code lautet wie folgt:

Hallo Johnhttp://ejohn.org/">John>, wie geht es
machst du?

jQuery

Code kopieren Der Code lautet wie folgt:

$("p").contents().not("[nodeType=1]").wrap("");Ergebnis:

Hallo JohnJohn>, wie geht es dir tun?

Beschreibung:

Fügen Sie einem leeren Frame etwas Inhalt hinzu

HTML

Code kopieren Der Code lautet wie folgt:

jQuery

Code kopieren Der Code lautet wie folgt:

$("iframe").contents().find("body")
.append("Ich bin in einem Iframe!");

Entfernen Sie den Iframe-Rahmen frameborder="0"

1 Der Inhalt enthält zwei I-Namen

Code kopieren Der Code lautet wie folgt:

jQuery im linken Frame ändert den Quellcode des Mainiframes:

Code kopieren Der Code lautet wie folgt:

$("#mainframe",parent.document.body).attr("src","

http://www.baidu.com
")

2 Wenn es im Inhalt ein IAME mit der ID des Mainiframes gibt

Code kopieren Der Code lautet wie folgt:

In den Unterfenstern A und B habe ich ein P mit der ID „Hallo“ platziert, um unsere DOM-Operationsdemonstration zu erleichtern. Die wichtigsten HTML-Codes der Unterfenster A und B lauten wie folgt:

Code kopieren Der Code lautet wie folgt:

Hallo Welt!

1. In einem Iframe betreibt das übergeordnete Fenster das DOM des untergeordneten Fensters

Das übergeordnete Fenster und das untergeordnete Fenster wurden erstellt, sodass wir die folgende iframeA()-Funktion im übergeordneten Fenster verwenden können, um die Hintergrundfarbe des untergeordneten Fensters A in Rot zu ändern:

Code kopieren Der Code lautet wie folgt:

functioniframeA(){//Ändern Sie die Hintergrundfarbe von Unterfenster A mit der ID hello
vara=getIFrameDOM("wIframeA");
a.getElementById('hello').style.background="red";
}
functiongetIFrameDOM(id){//iframeDOM-Erfassungsfunktion kompatibel mit IE und Firefox
returndocument.getElementById(id).contentDocument||document.frames[id].document;
}

2. Im Iframe betreibt das untergeordnete Fenster das DOM des übergeordneten Fensters

Im untergeordneten Fenster können wir das übergeordnete Fenster DOM einfach bedienen. Wir müssen nur die Methode des übergeordneten Yige-Objekts vor der DOM-Operation hinzufügen. Im obigen untergeordneten Fenster B können wir beispielsweise Folgendes verwenden Code ersetzt den Inhalt durch die ID „pHello“ im übergeordneten Fenster:

------------------

3. Im Iframe betreibt Unterfenster A das DOM von Unterfenster B

Da das untergeordnete Fenster das Fensterobjekt und das Dokumentobjekt des übergeordneten Fensters bedienen kann, kann das untergeordnete Fenster auch das DOM eines anderen untergeordneten Fensters bedienen ~ Broken Bridge Canxue kann das übergeordnete Fenster im untergeordneten Fenster B direkt verwenden, um getIFrameDOM direkt aufzurufen Übergeordnetes Fenster. Die Funktion ruft das Dokumentobjekt von Unterfenster A ab, sodass es sehr einfach ist, den Inhalt von Unterfenster A zu ändern, z. B. den folgenden Code:

Code kopieren Der Code lautet wie folgt:

vara=parent.getIFrameDOM("wIframeA");

============================================= === ==================================

Ein Problem mit der automatischen Änderung der Iframe-Höhe hat mich schon lange gestört. Ich habe im Internet nach Informationen gesucht, aber es war nicht sehr gut. Ich habe es mit jquery (Version 1.3.2) kombiniert, was nur 4 ist Codezeilen. Es ist perfekt kompatibel mit IE, Firefox, Opera, Safari, Google
Chrome, js lautet wie folgt:

Code kopieren Der Code lautet wie folgt:

Funktion heightSet(thisFrame){
if($.browser.mozilla || $.browser.msie){
             bodyHeight =window.frames["thisFrameName"].document.body.scrollHeight;
}else{
             bodyHeight =thisFrame.contentWindow.document.documentElement.scrollHeight;
//Diese Zeile kann die vorherige Zeile ersetzen, sodass die Parameter der heightSet-Funktion weggelassen werden können
//bodyHeight = document.getElementById("thisFrameId").contentWindow.document.documentElement.scrollHeight;
}
        document.getElementById("thisFrameId").height=bodyHeight; }

Zitat

Dieses Schlüsselwort scheint in verschiedenen Browsern unterschiedliche Bedeutungen zu haben. FF und IE müssen den Namen des Iframes verwenden, um die interne Seitenhöhe zu erhalten, während andere Browser dies oder die ID verwenden können

Zitat

Sie sprechen alle von einem asynchronen Problem. Wenn Sie Ajax häufig verwenden, es aber nicht jedes Mal einrichten möchten, wird das dynamische Ändern des Iframes Ihre Anforderungen an die Code-Sauberkeit definitiv nicht erfüllen. oder Sie können den iframe verlassen. Ich kann nur über die allgemeinen Verarbeitungsmethoden sprechen. Schließlich machen Ajax- oder dynamische Formulare in allgemeinen Anwendungen nur einen geringen Anteil aus. Nach einer asynchronen Anfrage müssen Sie am Ende nur Folgendes hinzufügen.

Js-Code

Code kopieren Der Code lautet wie folgt:

parent.window.heightSet();