The difference between the frame and iframe

First, the advantages and disadvantages of using an iframe

advantage:

　　1. programs into static pages more convenient;
　　2. separate pages and procedures;

Disadvantages:

　　1.iframe has a bad place: Style / script requires additional links, will increase request. Further security chain js only with anti-thief got, not anti-thief.
　　2.iframe fortunately able to display the original page intact all down, but if you use the home page, the search engine is the most annoying. Even then your website to do the good, not ranked good ranking! If dynamic pages, include a good point! But he had to remove the <html> <head> <title > <body> tag!
　　3. The frame structure can sometimes feel confused, especially up and down all appear in multiple frames, scroll bars around the time. These scroll bars in addition to crowding has been particularly limited page space, it will also pay attention to disperse force visitors. Visitors encounter such sites tend to turn away immediately. They will think, since your home so chaotic, then the other part of the site may not be more worth reading. (My view is that there do not appear sub-frame scroll bar, scroll bar of the window can be only controlled by the main page)
　　4. navigation links doubt. When using the frame structure, you must ensure correct configuration of all navigation links, as otherwise, will give visitors a great deal of trouble. For example, the linked page appears in the navigation frame, the visitors will be stuck in this situation, because this time he had no other place to go.
　　5. Call external page, you need to call additional css, to bring additional page number of requests;

Second, why less iframe

　　iframes provides a simple way to embed the content of a site to another site. But we need to be careful to use iframe. iframe created 1-2 orders of magnitude slower than the other to create scripts and css comprising the DOM element.

　　Use iframe pages generally do not contain much iframe, so the time to create a DOM node takes not account for a large proportion. But bring some other problems: onload event as well as the connection pool (connection pool).

1.Iframes blocking page loading

　　onload event trigger window in time is very important. onload event triggers the browser's "busy" indicator to stop, tell the user the current Web page has loaded. After loading delays onload event, it gives the user the feeling that this website is very slow.

　　window's onload event needs after all iframe is loaded (which contains the elements) will be triggered. In Safari and Chrome, the dynamic setting of the iframe SRC can avoid this situation by blocking JavaScript.

2. The only connection pool

　　Only a small number of open browser connected to the web server. Older browsers, Internet Explorer 6 & 7 and Firefox 2, only one domain name (hostname) open both connections. This has increased the number of restrictions in the new version of the browser. And Safari 3+ Opera 9+ domain can simultaneously open a connection 4, Chrome 1+, IE 8 Firefox 3 and 6 can be opened simultaneously. You can view the specific data table by this article: Roundup on Parallel Connections.

　　Some people may want to have their own independent iframe connection pool, but it is not the case. Most of the browser, the main page and the iframe is shared among these connections. This means that when loading iframe resources may run out of available connections, thereby blocking the main page load resources. If the contents of the iframe is more important than the content of the main page, which of course is very good. But usually, iframe the contents of the main page content is not important. Then the iframe run out of available connections is not worth the. One solution is, after important element on the main page is loaded, and then dynamically set the iframe SRC.

　　US top 10 sites use iframe. In most cases, they use it to load the ad. This is understandable, but also a logical solution, with a simple way to load the advertising service. But remember, iframe page will give you the impact on performance. Whenever possible, do not use iframe. When it does require prudent use them.

Three differences, iframe and frame of

1, frame can not be used singly from frameSet, iframe can;
2, Frame can not be placed in the body;

It can be displayed as follows:

<!--<body>-->
<frameset rows="50%,*">
<frame name="frame1" src="http://gongxquan.blog.163.com/test1.htm"/> 
<frame name="frame2" src="http://gongxquan.blog.163.com/test2.htm"/> 
</frameset> 
<!--<body>-->

It can not be shown as follows:

<body>
<frameset rows="50%,*">
<frame name="frame1" src="http://gongxquan.blog.163.com/test1.htm"/> 
<frame name="frame2" src="http://gongxquan.blog.163.com/test2.htm"/> 
</frameset> 
<body>

3, iframe nested frameSet must be placed in the body; and
the following display properly:

<body>
<frameset> 
<iframe name="frame1" src="http://gongxquan.blog.163.com/test1.htm"/> 
<iframe name="frame2" src="http://gongxquan.blog.163.com/test2.htm"/> 
</frameset> 
</body>

It can not be shown as follows:

<!--<body>-->
<frameset> 
<iframe name="frame1" src="http://gongxquan.blog.163.com/test1.htm"/> 
<iframe name="frame2" src="http://gongxquan.blog.163.com/test2.htm"/> 
</frameset> 
<!--</body>-->

4, iframe not nested frameSet may be free to use;

Both can be displayed as follows:

<body>
<iframe name="frame1" src="http://gongxquan.blog.163.com/test1.htm"/> 
<iframe name="frame2" src="http://gongxquan.blog.163.com/test2.htm"/> 
</body> 
<!--<body>-->
<iframe name="frame1" src="http://gongxquan.blog.163.com/test1.htm"/> 
<iframe name="frame2" src="http://gongxquan.blog.163.com/test2.htm"/> 
<!--</body>-->

5, frame height only by controlling frameSet; iframe can control their own, can not be frameSet control, such as:

<!--<body>-->
<frameset rows="50%,*">
<frame name="frame1" src="http://gongxquan.blog.163.com/test1.htm"/> 
<frame name="frame2" src="http://gongxquan.blog.163.com/test2.htm"/> 
</frameset> 
<!--</body>-->
<body>
<frameset>
<iframe height="30%" name="frame1" src="http://gongxquan.blog.163.com/test1.htm"/> 
<iframe height="100" name="frame2" src="http://gongxquan.blog.163.com/test2.htm"/> 
</frameset> 
</body>

6, if the use of the same page more than two iframe, can be normal in IE, in firefox shows only the first (firefox has improved, this problem does not exist); the use of two or more IE in the frame and can be used normally firefox

summary:

Both Frame and Iframe can realize the function is basically the same, but with more flexibility than Iframe Frame. the entire page frame is a frame, iframe is embedded in a page element, it can be said embedded frame Iframe tag called floating frame marker, it may be an HTML document in a display embedded HTML. It biggest difference Frame markers are embedded in a web page <Iframe> </ Iframe> included in the content of the entire page as a whole, and the content <Frame> </ Frame> included is a separate entity, is It can be independently displayed. In addition, the application Iframe can also display the same content multiple times on the same page, without having to duplicate code this content.

The following brief description about the usage and property ◆◆ ◆◆ <iframe> tag

A, <iframe> should also be a form of a frame, it <frame> is different, iframe may be embedded in any part of the page. We first give an example, the specific code such as:
<iframes width = height = 420. 330. frameborder = 0 = Auto scrolling the URL the src => </ iframes>, where the URL can be a relative path, an absolute path may be

width represents the width, height represents the height can be adjusted according to actual situation.
scrolling page display indicates whether the scroll bar, the optional parameter to auto, yes, no, if this parameter is omitted, the default is auto.

Second, how to implement a hyperlink on the page points to the embedded web pages
just give the iframe name on it. The method is <iframe name = **>, for example, I named player, write HTML language phrase <iframe width = 640 height = 25 name = player frameborder = 0 src = http: //www.cuiz.net/player. htm> </ iframe>,
then a hyperlink on a web page statement should be written as: <a href=URL target=cuiz> open player </a>

Frameset Properties

First, we understand the relevant property next Frameset tag:

<frameset cols = number or ratio, or the ratio of number> (left and right divided frame) or
<frameset rows = number or ratio, or the ratio of number> (vertical split frame)

This code can also be written:
<frameset cols = 120, *>

* By means of the left page length is 120, and the remaining space is left to the right of the page display and use.

Plus <frame> code after <frameset>:
. 1, the left side of the page if the page is displayed left.htm, the web page displayed to the right right.htm, the code is as follows:

2, display a web page if the page is the top.htm upper side, the lower page and the page is displayed foot.htm, would look like:
<frameset rows = 30, *>
<Frame the src = "the top.htm">
<Frame = the src "foot.htm">
</ frameset>

■ <frameset> tag control properties as follows:

framespacing = control the distance between the two frame;
frameborder = thickness control frame of frame;
border = thickness control frame, no frame will be set to 0
for a source page is divided as follows, shall be added not <body> tag:

frame properties

Other property tags frame as follows:
<frame> is used to describe the circumstances of each of the small window is divided, its main attributes are:

src: Specifies the path to the file links each frame, that is, the directory link file is located.

marginwidth: distance settings file with the left and right borders.

marginheight: settings file from the upper and lower borders.

noresize: prohibit the viewer to change the size of the frame.

scrolling: setting whether to display a scroll bar, a total of three parameters: yes (shown), NO (not shown) and auto (automatically by the browser determines whether the scroll bar), the default value is auto.

name: Set the name of the frame. (Can control a hyperlink location)

For example, when we want to press the link on the left side of the page in just the right to change the content of the page, then the link target's left of the page to add:
<A href = " http://bbs.cuiz.net " target = "right"> back Forum Home </a>

Please note that the link target is defined as _parent, which belong to the four special reserved value. They are:
_parent: href displays the new current location FRAMESET;
to _top: href displays the new window in the current overall position, such as in another FRAMESET FRAMESET in itself;
_self: href new forced display the current FRAME;
_blank: a new window display href;

It is defined herein display the right of the frame.

The following is an example iframe tags:

☆ frame size set value or more for reference. Generally, the player will take the shape of an elongated area of about 640 ~ 760px (pixel) width multiplied by the height 20 ~ 25px (pixels).
(If you use subtitles, you need the extra height of 60px)

☆☆☆☆ Here are a few examples of players to join in the page ☆☆☆☆

1, examples of embedding (vertical type - the player on the lower side) using a web frame (frameset) mode:

2, embedding example (vertical type - in the top player) using a web frame (frameset) mode:

3, the page frame using the embedding example (Type about - Player on the left) (frameset) mode:

When ☆☆ be embedded player action site, please note:

1. You must know how to frame the syntax of HTML applications, and know how to use a plain text editor to set the framework
syntax. If you have not mastered the wording of the framework of grammar, please search on the Internet to find out information.

2. Regardless of any way of grammar (including Javascript, etc.) the player into your website, you must
make sure that when visitors convert web pages without refreshing the page where the player at the same time, thus affecting player
movement.

3. If you are not familiar with HTML syntax, it is best not to use manner inline frame (iframe) in the player
embedded on websites, unless you understand your site layout suitable for use in this way embedded player.

4. The use of the above-described embodiment the frame (frameset or iframe) embedded in the player site, does not apply
to a pop-up window (Pop-up Window) open player. (Described above with reference to part of Traditional Chinese description)

Original author address: http: //www.jb51.net/article/77954.htm

　　　　　　https://blog.csdn.net/justinok/article/details/83123121

Explain the difference between the frame and iframe