本文详细介绍了HTML中IFrame的使用方法及其与框架页面的交互原理。通过实例展示了如何利用IFrame嵌套页面，以及如何通过设置不同的target属性实现页面在不同框架中的加载与显示，包括顶级框架、当前框架的父框架等。
主页面
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<table border="1">
<!--iframe:向一个页面发送了一个请求，
一个页面嵌套了另一个页面。
-->
<!--
这里我们要注意，iframe不能写空标签，
不然不显示框架。
-->
<!--src="left.html"链接当前页面的资源-->
<td><iframe name="left" src="left.html" frameborder="1"></iframe></td>
<td><iframe name="right" src="right.html" frameborder="1"></iframe></td>
</table>
</body>
</html>
默认页面
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>默认页面</title>
</head>
<body>
right
right
right
right
right
<iframe src="content.html" name="aaa"></iframe>
</body>
</html>
父框架页面
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>链接页面</title>
</head>
<body>
<!--
所有的框架的顶级框架是最大的这个页面的框架。
-->
<!-- href="content.html"作用是转接页面的标签-->
<!--
target="_top"显示最顶层，为顶级框架。
起作用是破坏了整个框架，
而来显示它自己的框架。
-->
<!--target="_blank"为新开一个窗口-->
<!--target="_parent"为链接到当前页面的父框架-->
<!--target="_search"-->
<!--target="_self"代表自身-->
<a href="content.html" target="_top">第一节</a>
<!--原来框架的默认页面为right right right right right，
这里将原来右边默认页面的内容替换掉了-->
<!--这样的好处就是，指定我们点击链接所要显示的页面-->
<a href="content.html" target="right">第一节</a>
<a>第一节</a>
<a>第二节</a>
<a>第三节</a>
</body>
</html>
父框架的链接页面
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>父框架的链接页面</title>
</head>
<body>
content
<a href="index-2.html" target="_parent">链接显示到父框架:</a>
</body>
</html>
操作结果：
1、点击主框架的第一个（紫色）链接
- 关闭页面，重新启动。点击主框架第二（紫色）链接。
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
