Heim Web-Frontend js-Tutorial Einführung in domänenübergreifende gegenseitige Zugriffsmethoden zwischen Iframe und Mainframe

Einführung in domänenübergreifende gegenseitige Zugriffsmethoden zwischen Iframe und Mainframe

Sep 16, 2017 am 09:33 AM
iframe 方法 访问

Heute muss ich nur die Implementierungsmethode des gegenseitigen Zugriffs zwischen Iframe und Hauptrahmen verwenden. Es ist wirklich gut, es zu teilen >

1. Gleicher gegenseitiger Zugriff zwischen Domänen

Angenommen, dass die Domänen A.html und b.html beide localhost (gleiche Domäne) sind.

Der Iframe in A.html ist eingebettet in B.html, name=myframe
A.html Es gibt eine js-Funktion fMain()
B.html hat eine js-Funktion fIframe()
, die implementiert werden muss. A.html ruft fIframe() auf. von B.html und B.html ruft fMain()
A.html


B.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
 <meta http-equiv="content-type" content="text/html; charset=utf-8">
 <title> main window </title>

 <script type="text/javascript">
 // main js function
 function fMain(){
	alert(&#39;main function execute success&#39;);
 }

 // exec iframe function
 function exec_iframe(){
	window.myframe.fIframe();
 }
 </script>

 </head>

 <body>
 <p>A.html main</p>
 <p><input type="button" value="exec iframe function" onclick="exec_iframe()"></p>
 <iframe src="B.html" name="myframe" width="500" height="100"></iframe>
 </body>
</html>
Nach dem Login kopieren


Klicken Sie auf

Die Exec-Iframe-Funktionsschaltfläche von HTML
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
 <meta http-equiv="content-type" content="text/html; charset=utf-8">
 <title> iframe window </title>

 <script type="text/javascript">
 // iframe js function 
 function fIframe(){
	alert(&#39;iframe function execute success&#39;);
 }

 // exec main function
 function exec_main(){
	parent.fMain();
 }
 </script>

 </head>

 <body>
 <p>B.html iframe</p>
 <p><input type="button" value="exec main function" onclick="exec_main()"></p>
 </body>
</html>
Nach dem Login kopieren
wird erfolgreich ausgeführt und

Iframe-Funktion erfolgreich ausgeführt wird angezeigt. Wie unten gezeigt

klicken Sie auf die Exec-Hauptfunktionsschaltfläche von B.html

, die Ausführung ist erfolgreich und

Hauptfunktion wird erfolgreich ausgeführt erscheint. Wie unten gezeigt

2. Domänenübergreifender gegenseitiger Zugriff

Angenommen, die A.html-Domäne ist localhost und die B.html-Domäne ist 127.0.0.1 (domänenübergreifend) Localhost und 127.0.0.1 werden hier nur verwendet, um das Testen zu erleichtern. Localhost und 127.0.0.1 befinden sich bereits in unterschiedlichen Domänen, sodass der Ausführungseffekt derselbe ist.

Im tatsächlichen Gebrauch wechseln Sie einfach zu www.domaina.com und www.domainb.com.

Der iframe in A.html ist in B.html eingebettet, name=myframe
A.html hat die js-Funktion fMain()
B.html hat die js-Funktion fIframe()
muss A implementieren .html, um fIframe() von B .html aufzurufen, B.html ruft fMain() von A.html auf (domänenübergreifender Aufruf)

Wenn Sie die obige Methode für dieselbe Domäne verwenden, bestimmt der Browser, dass A.html und B.html befinden sich in unterschiedlichen Domänen. Es wird eine Fehlermeldung angezeigt.
Nicht erfasster Sicherheitsfehler: Der Zugriff eines Frames mit dem Ursprung „http://localhost“ auf einen Frame mit dem Ursprung „http://127.0.0.1“ wurde blockiert. Protokolle, Domänen und Ports müssen übereinstimmen.


Umsetzungsprinzip:

Da der Browser aus Sicherheitsgründen den Zugriff von verschiedenen Domänen aus verbietet. Daher können die anrufenden und ausführenden Parteien aufeinander zugreifen, solange sie sich in derselben Domäne befinden.

Wie ruft A.html zunächst die fIframe-Methode von B.html auf?

1. Erstellen Sie einen Iframe in A.html.

2. Platzieren Sie die Iframe-Seite unter derselben Domäne wie B. html und nennen Sie es execB.html

3.execB.html enthält den js-Aufruf, der die fIframe-Methode von B.html aufruft



Auf diese Weise A.html kann execB.html übergeben. Die fIframe-Methode von B.html wird aufgerufen.

<script type="text/javascript"> 
parent.window.myframe.fIframe(); // execute parent myframe fIframe function 
</script>
Nach dem Login kopieren
In ähnlicher Weise muss B.html die fMain-Methode von A.html aufrufen. Es muss die execA.html in dieselbe Domäne wie A.html in B.html einbetten.

execA.html, um die aufzurufen A.html fMain-Methode. Die js ruft



auf, sodass A.html und B.html sich gegenseitig domänenübergreifend aufrufen können.

<script type="text/javascript"> 
parent.parent.fMain(); // execute main function 
</script>
Nach dem Login kopieren
A.html


B.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
 <meta http-equiv="content-type" content="text/html; charset=utf-8">
 <title> main window </title>

 <script type="text/javascript">

 // main js function
 function fMain(){
	alert(&#39;main function execute success&#39;);
 }

 // exec iframe function
 function exec_iframe(){
	if(typeof(exec_obj)==&#39;undefined&#39;){
		exec_obj = document.createElement(&#39;iframe&#39;);
		exec_obj.name = &#39;tmp_frame&#39;;
		exec_obj.src = &#39;http://127.0.0.1/execB.html&#39;;
		exec_obj.style.display = &#39;none&#39;;
		document.body.appendChild(exec_obj);
	}else{
		exec_obj.src = &#39;http://127.0.0.1/execB.html?&#39; + Math.random();
	}
 }
 </script>

 </head>

 <body>
 <p>A.html main</p>
 <p><input type="button" value="exec iframe function" onclick="exec_iframe()"></p>
 <iframe src="http://127.0.0.1/B.html" name="myframe" width="500" height="100"></iframe>
 </body>
</html>
Nach dem Login kopieren


execA. html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
 <meta http-equiv="content-type" content="text/html; charset=utf-8">
 <title> iframe window </title>

 <script type="text/javascript">
 // iframe js function 
 function fIframe(){
	alert(&#39;iframe function execute success&#39;);
 }

 // exec main function
 function exec_main(){
	if(typeof(exec_obj)==&#39;undefined&#39;){
		exec_obj = document.createElement(&#39;iframe&#39;);
		exec_obj.name = &#39;tmp_frame&#39;;
		exec_obj.src = &#39;http://localhost/execA.html&#39;;
		exec_obj.style.display = &#39;none&#39;;
		document.body.appendChild(exec_obj);
	}else{
		exec_obj.src = &#39;http://localhost/execA.html?&#39; + Math.random();
	}
 }
 </script>

 </head>

 <body>
 <p>B.html iframe</p>
 <p><input type="button" value="exec main function" onclick="exec_main()"></p>
 </body>
</html>
Nach dem Login kopieren


execB.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
 <meta http-equiv="content-type" content="text/html; charset=utf-8">
 <title> exec main function </title>
 </head>

 <body>
 	<script type="text/javascript">
		parent.parent.fMain(); // execute main function
	</script>
 </body>
</html>
Nach dem Login kopieren


wird wie unten gezeigt ausgeführt:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
 <meta http-equiv="content-type" content="text/html; charset=utf-8">
 <title> exec iframe function </title>
 </head>

 <body>
	<script type="text/javascript">
		parent.window.myframe.fIframe(); // execute parent myframe fIframe function
	</script>
 </body>
</html>
Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonEinführung in domänenübergreifende gegenseitige Zugriffsmethoden zwischen Iframe und Mainframe. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

AI Hentai Generator

AI Hentai Generator

Erstellen Sie kostenlos Ai Hentai.

Heißer Artikel

R.E.P.O. Energiekristalle erklärten und was sie tun (gelber Kristall)
3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Beste grafische Einstellungen
3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. So reparieren Sie Audio, wenn Sie niemanden hören können
3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25: Wie man alles in Myrise freischaltet
3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Wie lösche ich WeChat-Freunde? So löschen Sie WeChat-Freunde Wie lösche ich WeChat-Freunde? So löschen Sie WeChat-Freunde Mar 04, 2024 am 11:10 AM

WeChat ist eines der gängigen Chat-Tools. Über WeChat können wir neue Freunde treffen, alte Freunde kontaktieren und die Freundschaft zwischen Freunden pflegen. So wie es kein Bankett gibt, das nie endet, kommt es zwangsläufig zu Meinungsverschiedenheiten, wenn Menschen miteinander auskommen. Wenn eine Person Ihre Stimmung stark beeinflusst oder Sie feststellen, dass Ihre Ansichten nicht übereinstimmen, wenn Sie miteinander auskommen, und Sie nicht mehr kommunizieren können, müssen wir möglicherweise WeChat-Freunde löschen. Wie lösche ich WeChat-Freunde? Der erste Schritt zum Löschen von WeChat-Freunden: Tippen Sie auf der Hauptoberfläche von WeChat auf [Adressbuch]; der zweite Schritt: Klicken Sie auf den Freund, den Sie löschen möchten, und geben Sie im oberen Schritt [Details] ein rechte Ecke; Schritt 4: Klicken Sie unten auf [Löschen]; Schritt 5: Nachdem Sie die Eingabeaufforderungen der Seite verstanden haben, klicken Sie auf [Kontakt löschen].

So schreiben Sie einen Roman in der Tomato Free Novel-App. Teilen Sie das Tutorial zum Schreiben eines Romans in der Tomato Novel-App So schreiben Sie einen Roman in der Tomato Free Novel-App. Teilen Sie das Tutorial zum Schreiben eines Romans in der Tomato Novel-App Mar 28, 2024 pm 12:50 PM

Tomato Novel ist eine sehr beliebte Roman-Lesesoftware. Jeder Roman und Comic ist sehr interessant und möchte auch Romane schreiben Also, wie schreiben wir den Roman darin? Meine Freunde wissen es nicht, also lasst uns gemeinsam auf diese Seite gehen und uns eine Einführung zum Schreiben eines Romans ansehen. Teilen Sie das Tomato-Roman-Tutorial zum Schreiben eines Romans. 1. Öffnen Sie zunächst die kostenlose Tomato-Roman-App auf Ihrem Mobiltelefon und klicken Sie auf „Personal Center – Writer Center“. 2. Gehen Sie zur Seite „Tomato Writer Assistant“ – klicken Sie auf „Neues Buch erstellen“. am Ende des Romans.

Wie rufe ich das BIOS auf dem Colorful-Motherboard auf? Bringen Sie Ihnen zwei Methoden bei Wie rufe ich das BIOS auf dem Colorful-Motherboard auf? Bringen Sie Ihnen zwei Methoden bei Mar 13, 2024 pm 06:01 PM

Colorful-Motherboards erfreuen sich auf dem chinesischen Inlandsmarkt großer Beliebtheit und Marktanteil, aber einige Benutzer von Colorful-Motherboards wissen immer noch nicht, wie sie im BIOS Einstellungen vornehmen sollen? Als Reaktion auf diese Situation hat Ihnen der Herausgeber speziell zwei Methoden zum Aufrufen des farbenfrohen Motherboard-BIOS vorgestellt. Kommen Sie und probieren Sie es aus! Methode 1: Verwenden Sie die U-Disk-Start-Tastenkombination, um das U-Disk-Installationssystem direkt aufzurufen. Die Tastenkombination für das Colorful-Motherboard zum Starten der U-Disk ist zunächst ESC oder F11, um ein Black zu erstellen Wenn Sie den Startbildschirm sehen, drücken Sie kontinuierlich die ESC- oder F11-Taste auf der Tastatur, um ein Fenster zur Auswahl der Startelementsequenz aufzurufen. Bewegen Sie den Cursor an die Stelle, an der „USB“ angezeigt wird " wird angezeigt, und dann

So stellen Sie gelöschte Kontakte auf WeChat wieder her (ein einfaches Tutorial erklärt Ihnen, wie Sie gelöschte Kontakte wiederherstellen) So stellen Sie gelöschte Kontakte auf WeChat wieder her (ein einfaches Tutorial erklärt Ihnen, wie Sie gelöschte Kontakte wiederherstellen) May 01, 2024 pm 12:01 PM

Leider löschen Menschen aus bestimmten Gründen oft versehentlich bestimmte Kontakte. WeChat ist eine weit verbreitete soziale Software. Um Benutzern bei der Lösung dieses Problems zu helfen, wird in diesem Artikel erläutert, wie gelöschte Kontakte auf einfache Weise wiederhergestellt werden können. 1. Verstehen Sie den WeChat-Kontaktlöschmechanismus. Dies bietet uns die Möglichkeit, gelöschte Kontakte wiederherzustellen. Der Kontaktlöschmechanismus in WeChat entfernt sie aus dem Adressbuch, löscht sie jedoch nicht vollständig. 2. Nutzen Sie die integrierte „Kontaktbuch-Wiederherstellung“-Funktion von WeChat, um Zeit und Energie zu sparen. Mit dieser Funktion können Benutzer schnell gelöschte Kontakte wiederherstellen. 3. Rufen Sie die WeChat-Einstellungsseite auf und klicken Sie auf die untere rechte Ecke, öffnen Sie die WeChat-Anwendung „Me“ und klicken Sie auf das Einstellungssymbol in der oberen rechten Ecke, um die Einstellungsseite aufzurufen.

Zusammenfassung der Methoden zum Erhalten von Administratorrechten in Win11 Zusammenfassung der Methoden zum Erhalten von Administratorrechten in Win11 Mar 09, 2024 am 08:45 AM

Eine Zusammenfassung, wie Sie Win11-Administratorrechte erhalten. Im Betriebssystem Windows 11 sind Administratorrechte eine der sehr wichtigen Berechtigungen, die es Benutzern ermöglichen, verschiedene Vorgänge auf dem System auszuführen. Manchmal benötigen wir möglicherweise Administratorrechte, um einige Vorgänge abzuschließen, z. B. die Installation von Software, das Ändern von Systemeinstellungen usw. Im Folgenden werden einige Methoden zum Erhalten von Win11-Administratorrechten zusammengefasst. Ich hoffe, dass sie Ihnen helfen können. 1. Verwenden Sie Tastenkombinationen. Im Windows 11-System können Sie die Eingabeaufforderung schnell über Tastenkombinationen öffnen.

Das Geheimnis des Ausbrütens mobiler Dracheneier wird gelüftet (Schritt für Schritt erfahren Sie, wie Sie mobile Dracheneier erfolgreich ausbrüten) Das Geheimnis des Ausbrütens mobiler Dracheneier wird gelüftet (Schritt für Schritt erfahren Sie, wie Sie mobile Dracheneier erfolgreich ausbrüten) May 04, 2024 pm 06:01 PM

Mobile Spiele sind mit der Entwicklung der Technologie zu einem festen Bestandteil des Lebens der Menschen geworden. Mit seinem niedlichen Drachenei-Bild und dem interessanten Schlüpfvorgang hat es die Aufmerksamkeit vieler Spieler auf sich gezogen, und eines der Spiele, das viel Aufmerksamkeit erregt hat, ist die mobile Version von Dragon Egg. Um den Spielern dabei zu helfen, ihre eigenen Drachen im Spiel besser zu kultivieren und zu züchten, erfahren Sie in diesem Artikel, wie Sie Dracheneier in der mobilen Version ausbrüten. 1. Wählen Sie den geeigneten Drachenei-Typ aus, der Ihnen gefällt und zu Ihnen passt, basierend auf den verschiedenen Arten von Drachenei-Attributen und -Fähigkeiten, die im Spiel zur Verfügung stehen. 2. Verbessern Sie die Stufe der Brutmaschine, indem Sie Aufgaben erledigen und Requisiten sammeln. Die Stufe der Brutmaschine bestimmt die Schlüpfgeschwindigkeit und die Erfolgsquote beim Schlüpfen. 3. Sammeln Sie die Ressourcen, die die Spieler zum Schlüpfen benötigen

Schneller Meister: So eröffnen Sie zwei WeChat-Konten auf Huawei-Handys! Schneller Meister: So eröffnen Sie zwei WeChat-Konten auf Huawei-Handys! Mar 23, 2024 am 10:42 AM

In der heutigen Gesellschaft sind Mobiltelefone zu einem unverzichtbaren Bestandteil unseres Lebens geworden. Als wichtiges Werkzeug für unsere tägliche Kommunikation, Arbeit und unser Leben wird WeChat häufig genutzt. Allerdings kann es bei der Abwicklung unterschiedlicher Transaktionen erforderlich sein, zwei WeChat-Konten zu trennen, was erfordert, dass das Mobiltelefon die gleichzeitige Anmeldung bei zwei WeChat-Konten unterstützt. Als bekannte inländische Marke werden Huawei-Mobiltelefone von vielen Menschen genutzt. Wie können also zwei WeChat-Konten auf Huawei-Mobiltelefonen eröffnet werden? Lassen Sie uns das Geheimnis dieser Methode lüften. Zunächst müssen Sie zwei WeChat-Konten gleichzeitig auf Ihrem Huawei-Mobiltelefon verwenden. Der einfachste Weg ist

So stellen Sie die Schriftgröße auf dem Mobiltelefon ein (Schriftgröße auf dem Mobiltelefon einfach anpassen) So stellen Sie die Schriftgröße auf dem Mobiltelefon ein (Schriftgröße auf dem Mobiltelefon einfach anpassen) May 07, 2024 pm 03:34 PM

Das Festlegen der Schriftgröße ist zu einer wichtigen Personalisierungsanforderung geworden, da Mobiltelefone zu einem wichtigen Werkzeug im täglichen Leben der Menschen geworden sind. Um den Bedürfnissen verschiedener Benutzer gerecht zu werden, wird in diesem Artikel erläutert, wie Sie das Nutzungserlebnis Ihres Mobiltelefons verbessern und die Schriftgröße des Mobiltelefons durch einfache Vorgänge anpassen können. Warum müssen Sie die Schriftgröße Ihres Mobiltelefons anpassen? Durch Anpassen der Schriftgröße kann der Text klarer und leichter lesbar werden. Geeignet für die Lesebedürfnisse von Benutzern unterschiedlichen Alters. Praktisch für Benutzer mit Sehbehinderung, die Schriftgröße zu verwenden Einstellungsfunktion des Mobiltelefonsystems – So rufen Sie die Systemeinstellungsoberfläche auf – Suchen und geben Sie die Option „Anzeige“ in der Einstellungsoberfläche ein – suchen Sie die Option „Schriftgröße“ und passen Sie sie mit einem Drittanbieter an Anwendung – Laden Sie eine Anwendung herunter und installieren Sie sie, die die Anpassung der Schriftgröße unterstützt – öffnen Sie die Anwendung und rufen Sie die entsprechende Einstellungsoberfläche auf – je nach Person

See all articles