Frames are used to store subpages, either iframes or framesets. The window object is a global object, and all functions and objects on the page are in its scope.
1. Parent represents the parent window. If there are several layers of nesting in the parent window, top represents the top-level parent window.
self represents the window itself.
if(self==top){//}Just determine whether the window is at the top level if(self==parent){}//2.1. Parent page accesses child page elements. The idea is that all elements of the subpage are in its window.document object, just get it first and then it's easy to say.
It is best to set the name attribute for the frame, which is the most convenient operation. like
<iframe name="test" src="child.html"></iframe>
If you want to get the element with id 'menu' in child.html, you can write it like this:
window.frames["test"].document.getElementById('menu'); //Since all functions are stored in the window object, the beginning window can be removed: frames["test"].document.getElementById('menu'); //In the browser, the name attribute of the frame is equivalent to the window object of the subpage by default, so it can be further abbreviated: test.document.getElementById('menu');2.2 Parent page accesses child page functions or objects. The functions and objects of the subpage are in their window objects, the same as above, the key is to obtain the object.
//If child.html defines the showMesg function and needs to be called in the parent, then write window.frames['test'].showMesg(); //Abbreviated form test.showMesg(); //Similarly, the object also accesses alert(test.person);
2.3 Other ways to obtain documents.
First use 'document.getElementById()' or 'document.getElementsByTagName()' to get the frame as the Element under the document, and then access its attribute contentDocument/contentWindow (iframe, frame-specific), the first one is ie7-not supported, and the second one is not supported.
<iframe id="testId" src="child.html"></iframe> //====== var doc=document.getElementById('testId'); //or var doc=document.getElementsByTagName('iframe')[0]; Then var winOrdoc=doc.contentDocument||doc.contentWindow;//Choose one of two if(winOrdoc.document)winOrdoc=winOrdoc.document; winOrdoc.getElementById('menu'); //If you need a window object, write it like this: if(winOrdoc.defaultView)winOrdoc=winOrdoc.defaultView;3.1 Child page accesses parent page elements. The same idea as 2.1, first get the parent window window.document object
parent.window.document.getElementById('parentMenu'); //Abbreviation parent.document.getElementById('parentMenu');3.2. The child page accesses the parent page function or object. The same idea as 2.2, first get the parent window window object.
parent.parentFunction();
Finally, let’s mention the same origin strategy of js, that is, the js code located on website A does not allow access to content located on website B, even if the code originates from website B. If the frame is a page of other websites, then when accessing each other according to the above method, the browser should prompt: 'No permission' error.