JavaScript IFRAME programming related code _javascript tips

Source: Internet
Author: User
Recently in the processing of several projects have used the IFRAME, sometimes a page has multiple iframe, and several IFRAME need to access each other's functions or the function of the parent window. Today, you will be free to do the page framework programming to do a collation.
All frames in a page are provided as properties of the Window object in the form of a collection, for example: Window.frames represents a collection of all the frames within the page, similar to the form objects, linked objects, picture objects, and so on, and these collections are the properties of the document. Therefore, to refer to a child frame, you can use the following syntax:
Copy Code code as follows:

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

Where the window typeface can also be replaced or omitted with self, assuming that FrameName is the first frame in the page, the following is equivalent:
Copy Code code as follows:

self.frames["FrameName"]
Self.frames[0]
Frames[0]

FrameName
Each frame corresponds to an HTML page, so the frame is also a standalone browser window that has all the properties of a window, a reference to a frame that is a reference to a Window object. With this Window object, you can easily manipulate 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 inside the frame, and so on.

The following are references to each other between different levels of frameworks:
1. Reference to the parent frame to the child frame
Knowing the above principle, referencing the child frame from the parent frame becomes very easy, namely:
window.frames["FrameName"];
This refers to a child frame named FrameName within the page. If you want to refer to a child frame within a child frame, you can do so by referring to a frame that is actually the nature of the Window object:
window.frames["FrameName"].frames["frameName2"];
This refers to a two-level child framework, and so on, you can implement a reference to a multi-tier framework.
2. Child frame to Parent frame reference
Each Window object has a parent attribute, which represents its parental frame. If the frame is already a top-level frame, window.parent also represents the framework itself.
3. The reference between the brothers frame
If two frames are a child of a framework, they are called sibling frameworks, and can be referenced through the parent framework, such as a page that includes 2 child frames:
Copy Code code as follows:

<frameset rows= "50%,50%" >
<frame src= "1.html" name= "frame1"/>
<frame src= "2.html" name= "frame2"/>
</frameset>

You can use the following statement to refer to frame2 in frame1:
self.parent.frames["Frame2"];
4. Mutual reference between different levels of frames
The hierarchy of the framework is for the top level framework. When levels are different, you can easily access each other by knowing the hierarchy and the hierarchy and name of the other frame, and by using the Window object properties referenced by the framework, for example:
self.parent.frames["ChildName"].frames["Targetframename"];
5. References to top-level frames
Like the Parent property, the Window object also has a top property. It represents a reference to the top-level framework, which can be used to determine whether a frame itself is a top-level frame, for example:
Copy Code code as follows:

//Determine if this frame is a top-level frame
if (self==top) {
//dosomething
}

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.