The difference between HTML iframe and frameset_PowerNode Java Academy

Introduction

1.<iframe> tag: iframe is an inline frame that generates an internal frame in the page.

2. <frameset> tag: frameset defines a frame set, which contains multiple sub-frames, each of which has an independent document.

<iframe> Tag

Iframe is an inline frame, which generates an internal frame in the page.

property

frameborder{int}: whether to display the frame border;

src{URL}: specifies the URI of a resource (such as a web page or image);

scrolling{boolean}: whether to display the scroll bar of the frame;

width{int}: defines the width of the iframe;

height{int}: defines the height of the iframe;

Example

<body>
<h3>HTML Tag Demonstration</h3>
<iframe src=1.1-ShowHtml.htm ></iframe>
</body>

Precautions

When adding content in "<iframe>I am content</iframe>", the added content will not be displayed on the display page. So let's use the src attribute to specify a page.

Application Scenario

1) On the version upgrade page, if there are too many version logs, the upgrade information can be placed in an iframe.

2) Rich text editing box, such as the [New Essay] area in Blog Garden.

<frameset> Tag

Frameset defines a frame set, which contains multiple frames, each of which has an independent document.

Format

<frameset>
  <frame src=a.htm />
  <frame src=b.htm />
  <noframes></noframes>
</frameset>

Sub-item Description

<framesrc=a.htm />: Subframe<noframes></noframes>: Content displayed when the browser does not support this frame.

property

frameset attributes:

rows: indicates that the subframe is laid out in rows ( ). Take two subframes as an example: rows="30%,*" means the first frame takes up 30% of the height of the entire page, and the second takes up the rest; cols: means the subframes are laid out in columns ( ). Take two sub-frames as an example: cols="30%,*" means that the first frame takes up 30% of the length of the entire page, and the second takes up the rest; noresize="noresize" means that the range of the sub-frame will not be adjusted.

frame attribute:

src: URI pointing to a resource (such as a page, picture, etc.);

name: Specifies the name of the frame to facilitate operations between frames.

Example

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>frameset demo</title>
</head>
<frameset rows="30%,*" noresize="noresize">
    <frame src=DateGrid.htm name="frm1" />
    <frame src=Dialog.htm name="frm2"/>
    <noframes></noframes>
</frameset>
</html>

Precautions

When using the frameset tag, be sure to remove the outer <body></body> tags.

Operations between subframes

Referring to the sample code, frm1 changes the page pointed to by the subset of frm2: window.parent.frames["frm2"].location.href = 'b.htm'

Application Scenario

1) Management of the background page, the menu is displayed on the left, and the detailed page is displayed in the right frame.

2) Function menu page, such as bbs.csdn.net

Quick Facts

When browsing the frames in a page, right-click inside the frame page to display additional frame information.

Take Chrome as an example:

<<: Solve the problem of not being able to enter breakpoints when using GDB in Docker

>>: MySQL Flush-List and dirty page flushing mechanism

Several ways to implement inheritance in JavaScript

The difference between HTML iframe and frameset_PowerNode Java Academy

Several ways to implement inheritance in JavaScript

Docker Compose network settings explained

Mysql Sql statement exercises (50 questions)

Does Mysql ALTER TABLE lock the table when adding fields?

Front-end vue+express file upload and download example

Detailed explanation of Docker data backup and recovery process

The visual design path of the website should conform to user habits

jQuery achieves seamless scrolling of tables

How to implement CSS mask full screen center alignment

MySQL 8.0.18 deployment and installation tutorial under Windows 7

Recommend

Talk about how to identify HTML escape characters through code

The perfect solution for MYSQL5.7.24 installation without data directory and my-default.ini and service failure to start

Detailed explanation of the use of MySQL paradigm

How to install docker on centos

JavaScript anti-shake and throttling detailed explanation

MySQL PXC builds a new node with only IST transmission (recommended)

MySQL briefly understands how "order by" works

Vue implements countdown between specified dates

How to implement email alert in zabbix

How does Vue solve the cross-domain problem of axios request front end

Use Docker to build a Git image using the clone repository

Detailed explanation of setting up DNS server in Linux

MySQL query redundant indexes and unused index operations

Implementation of Linux command line wildcards and escape characters

How to update Ubuntu 20.04 LTS on Windows 10