Heim > Web-Frontend > js-Tutorial > Zusammenfassung der Fähigkeiten zur Interaktion mit übergeordneten und untergeordneten Javascript-Seiten_Javascript-Fähigkeiten

Zusammenfassung der Fähigkeiten zur Interaktion mit übergeordneten und untergeordneten Javascript-Seiten_Javascript-Fähigkeiten

WBOY
Freigeben: 2016-05-16 16:40:04
Original
1202 Leute haben es durchsucht

Frame wird zum Speichern von Unterseiten verwendet, die entweder ein Iframe oder ein Frameset sein können. Das Fensterobjekt ist ein globales Objekt und alle Funktionen und Objekte auf der Seite liegen in seinem Gültigkeitsbereich.
1. Parent stellt das übergeordnete Fenster dar. Wenn das übergeordnete Fenster mehrere Verschachtelungsebenen aufweist, stellt top das übergeordnete Fenster der obersten Ebene dar.
self repräsentiert das Fenster selbst.

if(self==top){//}判断窗口是否处于顶级 
if(self==parent){}//也可以
Nach dem Login kopieren

2.1. Die übergeordnete Seite greift auf die untergeordneten Seitenelemente zu. Die Idee ist, dass sich alle Elemente der Unterseite in ihrem window.document-Objekt befinden. Es ist einfach, sie zuerst abzurufen und dann darüber zu sprechen.
Am besten legen Sie das Namensattribut des Rahmens fest, was den bequemsten Vorgang darstellt. Wie zum Beispiel

<iframe name="test" src="child.html"></iframe>
Nach dem Login kopieren

Wenn Sie das Element mit der ID „menu“ in child.html erhalten möchten, können Sie so schreiben:

window.frames["test"].document.getElementById('menu'); 
//由于所有的函数都存放在window对象里面,可去掉开头的window: 
frames["test"].document.getElementById('menu'); 
//在浏览器中,帧的name属性被默认等同于子页面的window对象,因此可以进一步简写: 
test.document.getElementById('menu');
Nach dem Login kopieren

2.2 Die übergeordnete Seite greift auf Funktionen oder Objekte der untergeordneten Seite zu. Die Funktionen und Objekte der Unterseite befinden sich alle in ihrem Fensterobjekt. Der Schlüssel besteht darin, das Objekt zu erhalten.

//假如child.html定义了showMesg函数,需要在父中调用,则这样写 
window.frames['test'].showMesg(); 
//简写形式 
test.showMesg(); 
//同理,对象也是如此访问 
alert(test.person);
Nach dem Login kopieren

2.3 Andere Möglichkeiten, Dokumente zu erhalten.
Verwenden Sie zuerst „document.getElementById()“ oder „document.getElementsByTagName()“, um den Frame als Element unter dem Dokument abzurufen, und greifen Sie dann auf seine Eigenschaften contentDocument/contentWindow zu (spezifisch für iframe und frame). Die erste wird nicht unterstützt von ie7-. Das zweite Chrome wird nicht unterstützt.

<iframe id="testId" src="child.html"></iframe> 
//====== 
var doc=document.getElementById('testId'); 
//或者 
var doc=document.getElementsByTagName('iframe')[0]; 
然后 
var winOrdoc=doc.contentDocument||doc.contentWindow;//二选一 
if(winOrdoc.document)winOrdoc=winOrdoc.document; 
winOrdoc.getElementById('menu'); 
//如果需要window对象,则这样写: 
if(winOrdoc.defaultView)winOrdoc=winOrdoc.defaultView;
Nach dem Login kopieren

3.1 Unterseite greift auf übergeordnete Seitenelemente zu. Die Idee ist die gleiche wie in 2.1. Rufen Sie zuerst das übergeordnete Fenster window.document-Objekt
ab

parent.window.document.getElementById('parentMenu'); 
//简写 
parent.document.getElementById('parentMenu');
Nach dem Login kopieren

3.2, Die untergeordnete Seite greift auf die Funktion oder das Objekt der übergeordneten Seite zu. Die Idee ist die gleiche wie in 2.2. Rufen Sie zuerst das übergeordnete Fensterobjekt ab.

parent.parentFunction();
Nach dem Login kopieren

Abschließend möchte ich noch die Same-Origin-Richtlinie von js erwähnen, d. h. der auf Website A befindliche JS-Code darf nicht auf den Inhalt auf Website B zugreifen, selbst wenn der Code von Website B stammt. Wenn es sich bei dem Frame um eine Seite einer anderen Website handelt, sollte der Browser beim gegenseitigen Zugriff mit der oben genannten Methode die Fehlermeldung „Keine Berechtigung“ melden.

Verwandte Etiketten:
Quelle:php.cn
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage