Home > Web Front-end > JS Tutorial > body text

javascript iframe programming related code_javascript skills

WBOY
Release: 2016-05-16 18:37:51
Original
1041 people have browsed it

Iframes have been used in several projects recently. Sometimes there are multiple iframes in a page, and several iframes need to access each other's functions or the functions of the parent window. If I have time today, I will sort out the page frame programming.
All frames in a page are provided as attributes of the window object in the form of a collection. For example: window.frames represents the collection of all frames in the page. This is similar to form objects, link objects, picture objects, etc. The difference is that these collections are properties of the document. Therefore, to reference a subframe, you can use the following syntax:

Copy the code The code is as follows:

window.frames["frameName"];
window.frames.frameName
window.frames[index]

Among them, the word window can also be replaced or omitted with self, assuming frameName is the first frame in the page, the following writing is equivalent:
Copy the code The code is as follows:

self.frames["frameName"]
self.frames[0]
frames[0]

frameName
Each frame corresponds to an HTML page , so this frame is also an independent browser window, which has all the properties of a window. The so-called reference to the frame is also a reference to the window object. With this window object, you can easily operate the pages in it, such as using the window.document object to write data to the page, using the window.location property to change the page in the frame, etc.

The following introduces the mutual references between different levels of frameworks:
1. Reference from parent frame to child frame
Knowing the above principles, it is very easy to reference the child frame from the parent frame, that is:
window.frames["frameName"];
This is the reference A subframe named frameName within the page. If you want to reference a subframe within a subframe, according to the nature of the window object, the referenced frame can be implemented like this:
window.frames["frameName"].frames["frameName2"];
In this way, the reference is made When it comes to the second-level sub-frame, and so on, the reference of multi-layer frameworks can be realized.
2. Reference from child frame to parent frame
Each window object has a parent attribute that represents its parent frame. If the frame is already a top-level frame, window.parent also represents the frame itself.
3. References between sibling frames
If two frames are sub-frames of the same frame, they are called sibling frames. They can reference each other through the parent frame. For example, a page includes 2 sub-frames:
Copy code The code is as follows:






In frame1, you can use the following statement to reference frame2:
self.parent.frames["frame2"];
4. Mutual references between frameworks at different levels
The level of the framework is for the top-level framework. When the levels are different, as long as you know the level where you are and the level and name of the other frame, you can easily access each other by using the properties of the window object referenced by the frame, for example:
self.parent.frames["childName "].frames["targetFrameName"];
5. The reference to the top-level frame
is similar to the parent attribute. The window object also has a top attribute. It represents a reference to the top-level frame, which can be used to determine whether a frame itself is a top-level frame, for example:
Copy code Code As follows:

//Judge whether this frame is a top-level frame
if(self==top){
//dosomething
}
Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template