The effect of "painting in Painting"--on the use of IFRAME labels

Source: Internet
Author: User
Tags object object model window access
Throughout the current site, the original speed is a little slow, but almost every page to put what banner, column pictures, copyright, such as a lot of similar things, of course, for the unity of the website style, the need for advertising effect, this is understandable, but after all, let the user's wallet for these "embellishment" of things "increasingly lost money gaunt", Is there a way to let these same things download once after downloading, but only to download the content has changed the content of the page?
The answer is yes: Apply the IFRAME tag!

   I. The use of the IFRAME tag
If you bring up an IFRAME, you may have already thrown it into the "forgotten Corner", but speaking of its brother frame will not be unfamiliar. The frame tag, which we call the multiple frame structure, is the display of multiple HTML files in a browser window. Now, we have a very realistic situation: if there is a tutorial, is a section of the ground, at the end of each page to do a "previous", "Next" link, in addition to each tutorial content is different, the other part of the page is the same, if a page to do stupid page, this seems to be too boring, when the whim, If there is a way to keep the rest of the page unchanged, just make the tutorial a page-by-page content page, does not contain other content, click the page up and down the link, only change the content of the tutorial, the other remains unchanged, so that one is time-saving, the other after the tutorial has a happens changes, but also very convenient, not in the lead and move the whole army; More important is that those ads banner, column list, navigation and so on almost every page of things only download once and then no longer download.
An IFRAME tag, also known as a floating frame tag, that you can use to embed an HTML document in an HTML display. It differs from the biggest feature of the frame tag that the HTML file referenced by this tag is not displayed independently of the other HTML file, but can be embedded directly in an HTML file, merging with the content of the HTML file, and becoming a whole, in addition, You can also display the same content multiple times on one page without having to repeat the content, an image metaphor is "picture in picture" TV.
Now let's talk about the use of the IFRAME tag.
The use format of the IFRAME tag is:
   <iframe src= "URL" width= "x" height= "x" scrolling= "[OPTION]" frameborder= "x" ></iframe>
SRC: The path of the file, both HTML files, but also can be text, ASP, etc.
width, height: "Painting in the picture" area of the width and height;
Scrolling: When the specified HTML file in SRC does not show up in the specified area, the scrolling option, if set to No, the scroll bar does not appear, for auto: The scroll bar appears automatically;
Frameborder: The width of the area border, which is often set to 0 in order for the picture to be merged with the adjacent content.
Like what:
<iframe src= "Http://netschool.cpcw.com/homepage" width= "height=" scrolling= "no" frameborder= "0" >< /iframe>

   Mutual control between the parent form and the floating frame
In the scripting language and object hierarchy, the window that contains the IFRAME we call the parent form, and the floating frame is called a subform, it is important to understand the relationship between the two, because in order to access the subform in the parent form or the opposite, you must know the object hierarchy to access and control the form programmatically.
   1. Accessing and controlling objects in a subform in a parent form
In the parent form, the IFRAME, the subform, is a child of the Document object, and you can access the objects in the subform directly in the script.
Now there is a question, that is, how do we control this IFRAME, here we need to talk about the IFrame object. When we set the id attribute on this tag, we can control the HTML contained in the IFRAME through the Document Object model DOM.
For example, embed test.htm files in example.htm and control some tag objects in test.htm:
<iframe src= "test.htm" id= "Test" width= "" height= "scrolling=" "No" frameborder= "0" ></iframe>
The Test.htm file code is:
<body>
&LT;H1 id= "myH1" >hello,my boy</body>
If we want to change the text in the H1 tag with ID number myH1 as hello,my dear, it is available:
document.myh1.innertext= "Hello,my Dear" (of which the document may be province)
In the example.htm file, the child form that the IFRAME tag object refers to is consistent with the general DHTML object Model, and is no longer described as an object access control method.
   2. Accessing and controlling objects in the parent form in a subform
In the subform, we can access the object in the parent window through its parent, or parental, object.
such as example.htm:
<body >
<iframe name= "tt" src= "frame1.htm" Width= "No." Height= "scrolling=" "No" frameborder= "0" ></iframe>
&LT;H1 id= "myH2" >hello,my wife</body>
If you want to access the header text in myH2 in frame1.htm and change it to "hello,my friend," We can write this: parent.myh2.innertext= "hello,my friend"
Here the parent object represents the current form (the form on which Example.htm is located), and the object in the parent form is accessed in the subform, without exception through the parent object.
iframe, although embedded in another HTML file, but it remains relatively independent, is an "independent kingdom" Yo, in the single HTML features also apply to floating frames.
Imagine, through the IFRAME tag, we can change those unchanged content in an IFRAME, so that you do not have to repeat the same content, which is a bit like the process or function in the program design, reducing the number of tedious manual labor! In addition, it is important that it makes the modification of the page more feasible because, instead of modifying each page because of the layout adjustment, you simply need to modify the layout of a parent form.
There is a point to note that Nestscape Browser does not support the IFRAME tag, but in the current IE's world, this seems to be no harm, the widespread use of IFRAME tag, both for their own (website) to think, but also for users to save the net fee, why not?

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.