读书人

frame,iframe跟frameset简单介绍

发布时间: 2012-11-04 10:42:41 作者: rapoo

frame,iframe和frameset简单介绍
(1) frameset标签:

这个标签主要是用来定义一个框架集,它可以组织整个页面,frameset标签有两个特别有用的属性,cols和rows,它们可以规定各个框架是按行还是按列来摆放。下面简单介绍下这两个属性值的设置方式:

◆ 实际像素

<framesetrows="150,300,150">

◆ 比例

<framesetrows="25%,50%,25%">

另外还有可能会出现星号,它是告诉浏览器将剩余的空间按照行或者按照列分配给其余的框架,如

<frameset cols="100,*">

首先生成宽为100像素的列,然后再生成另一个框架列,该列会占据其余的所有空间。

【注意】frameset标签不能与body标签一起使用!

(2) frame标签:

这个标签用来设置frameset中的一个特定窗口(框架)。其中frameborder,noresize, src分别是用来规定框架是否显示周围的边框、是否能重新调整大小以及框架中所显示的文档的URL。

(3) iframe标签:

iframe标签可以定义文档的一个内联框架。常见的属性有:

height,width------------------设置框架的高度和宽度

frameborder-------------------是否显示边框

注意,iframe标签可以在任何地方使用,它的应用范围以及灵活性要远大于frame.

下面重点讲解frame与iframe标签的常见区别:

◆ frame不能脱离frameset使用,iframe则可以,因此后者具有更大的应用范围,另外frameset不能与body标签并存,因此frame不能用在body中,而iframe则可以,但值得注意的是,若iframe嵌套在frameset中,则框架只有出现在body中才能显示,若此时同时出现frame,则不予显示

◆ frame的宽高只能是在frameset中定义,而iframe的宽高则可以自己设置;

◆ 若同时出现多个iframe,则在IE浏览器中都能正常显示,但是在FF浏览器中只能显示第一个

frame,iframe跟frameset简单介绍

(4) 框架之间的跨域问题:

以上图为例,若要实现在b框架页面中刷新c框架,则可以用:

window.parent.frames['c'].document.location.reload();或者

self.parent.frames['b'].document.location.reload();

注意window对象表示一个浏览器窗口或者一个框架,framese[]返回的是窗口中的所有框架对象。

除此之外,还可以跨域访问方法以及其它页面元素,在此就不一一列举。


读书人网 >Web前端

热点推荐