Javascript iframe programming code

Source: Internet
Author: User

Iframe has recently been used in several projects. Sometimes there are multiple iframe in a page, and several iframe need to access each other's functions or parent window functions. Today, I will organize the page framework programming.
All frames on a page are provided as properties of the window object in the form of a set, for example, window. frames indicates the set of all frames on the page. This is similar to form objects, link objects, and image objects. The difference is that these sets are the attributes of document. Therefore, to reference a sub-framework, you can use the following syntax:
Copy codeThe Code is as follows:
Window. frames ["frameName"];
Window. frames. frameName
Window. frames [index]

The window can also be replaced or omitted by self. If frameName is the first frame on the page, the following statements are equivalent:
Copy codeThe Code is as follows:
Self. frames ["frameName"]
Self. frames [0]
Frames [0]

FrameName
Each framework corresponds to an HTML page, so this framework is also an independent browser window, which has all the properties of the window. The so-called reference to the framework is also a reference to the window object. With this windowless object, you can easily perform operations on the page. For example, you can use the volume upload Doc ument object to write data to the page, and use the window. location attribute to change pages in the framework.

The following describes the mutual references between frameworks of different levels:
1. Reference from parent framework to Child Framework
With the above principles, it is very easy to reference the sub-framework from the parent framework, that is:
Window. frames ["frameName"];
In this way, the sub-framework named frameName in the page is referenced. If you want to reference the sub-framework in the sub-framework, the referenced framework is actually the nature of the window object, which can be implemented as follows:
Window. frames ["frameName"]. frames ["frameName2"];
In this way, the second-level sub-framework can be referenced, and so on.
2. references from the Child Framework to the parent framework
Each window object has a parent attribute, indicating its parent framework. If the framework is already a top-level framework, window. parent also indicates the framework itself.
3. Reference between sibling frameworks
If the two frameworks are the same as the Child frameworks of the same framework, they are called the sibling frameworks, you can use the parent framework to reference each other. For example, a page contains two child frameworks:
Copy codeThe Code is as follows:
<Frameset rows = "50%, 50%">
<Frame src = "1.html" name = "frame1"/>
<Frame src = "2.html" name = "frame2"/>
</Frameset>

In frame1, you can use the following statement to reference frame2:
Self. parent. frames ["frame2"];
4. Mutual reference between frameworks of different levels
The framework layer is for the top-level framework. When the layers are different, you only need to know your own layers and the layers and names of another framework, and use the window object properties referenced by the Framework to easily implement mutual access. For example:
Self. parent. frames ["childName"]. frames ["targetFrameName"];
5. Reference to the top-level framework
Similar to the parent attribute, the window object also has a top attribute. It indicates a reference to the top-level framework, which can be used to determine whether a framework itself is a top-level framework. For example:
Copy codeThe Code is as follows:
// Determine whether the framework is a top-level framework
If (self = top ){
// Dosomething
}

Related Article

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.