网页布局框架之Iframe

时间:2022-05-12 05:42:20

     前一段时间按领导要求做一个项目。框架搭建时,页面布局是这样的:

     网页布局框架之Iframe网页布局框架之Iframe网页布局框架之Iframe

      按照现行流行的大多数框架的布局大概就是这样,比较火的bootstrap、easyUI、extjs、ligerUI、miUI等前端框架的布局大多数都采用这样的格局。那么问题来了,当点击左边的menu时,实现内容在右边的content呈现?

      大多数据程序猿的选择方式就是使用Iframe。利用Iframe的src属性进行页面内置跳转。

     那么问题来了,这样把整个页面三分天下,也就是说每一个分割都是一个jsp展现,那么就需要4个jsp才能满足这个效果。我们定义整个页面叫main.jsp,网页三分天下分别是top.jsp   menu.jsp  content.jsp。那么我在content.jsp拿到main.jsp中一个标签怎么办呢?

     首先在网页布局中一定要知道window、document对象的区别。按照W3C的标准,网页需要有w3C的声明,然后才是html、head、body对象构成。而这里的body标签中对象就是document、而html包含的内容是就是window对象。

    那么清楚了这个,下面获取就简单了。我们首先拿到content.jsp页面的window对象、通过window对象找到document,然后知道页面的iframe的name,我们可以通过frames得到这个iframe对象,下面就简单了,得到iframe的parent,然后就拿到了content.jsp。下面就简单了。直接按照w3c标准拿值。