多层嵌套Iframe的自适应问题解决

最新推荐文章于 2025-10-26 10:40:37 发布

原创

最新推荐文章于 2025-10-26 10:40:37 发布 · 9.4k 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#iframe #javascript #浏览器 #microsoft #function #框架

本文详细探讨了Iframe在网页中的应用，动态嵌入网页内容的方法，以及不同浏览器对Iframe的支持情况。针对Iframe自适应高度的问题，文章列举了多种解决方案，包括Microsoft扩展的JavaScript实现、动态改变框架高度等。作者分享了自己解决多层嵌套Iframe高度调整的实践经验，强调理解原理和耐心调试的重要性。

/**
* <title>多层嵌套Iframe的自适应问题解决</title>
*
* @author: Cheng
* @Email : bohemia1985@163.com
*/

一.为什么需要Iframe?
由于Iframe相当于独立的窗体，因此可以动态改变Iframe中的稳当的内容，
而没有必要改变其他的元素。正是因为这个特点，所以Iframe在某方面就显示
了它的优越性。
对于我的情况，主要是为了减少重复载入网页中已经存在的标题，导航蓝
等元素；另外可以实现导航功能。

二.如何在网页中动态嵌入其他网页代码?
如上所述，通过IFrame可以实现动态的改变页面中某部分内容，而无须刷新
整个页面，那有没有其他方式可以实现动态的改变网页的内容，而无须刷新整个
页面方法呢？
通过在网络上搜索，学习。发现了一些其他方法：
1.AJAX,（Asynchronous JavaScript And XML）。总体来说，它是各种技术的综合。
通过XMLHttpRequest动态的请求服务器的页面数据，然后在客户浏览器端，改变网页
中某些元素的内容，但无须重新下载整个页面，正是因为这个特性，所以AJAX被很多
地方应用。也得到了很大发展，但使用AJAX的前提是要编写很多脚本文件。相对使用
IFrame来说，稍微复杂一点。不过很多书已经给了很多参考。<<AJAX In Action>>等
都可以作为学习使用。

2.通过使用页面对象<object type="text/html" data="test.htm">.
可以实现内嵌页面元素，但由于不能（或许是我没有找到）高度的动态扩展，因此
显示起来，不是我想要的效果。因此没有采用。

三.使用Iframe的限制。
并不是所有的浏览器都支持Iframe元素的。
目前主要的浏览器包括IE、Firefox、Opera等。其余很多浏览器主要是
基于IE,Netscape,等内核。但Iframe只在IE,Opera浏览器中被支持。所以
如果必须使用，则必须保证所使用的浏览器基于IE,Opera等内核。
关于浏览器平台介绍，请参考下面的文章。
http://www.alls.cn/data/2005/1221/article_3747.html

四.网上存在的Iframe自扩展解决方案.

Iframe自适应页面的解决方案：
目前只要你在Google中搜索"Iframe自适应"，就可以得到很多有关Iframe
自适应的解决方法，总共可分以下下几种：
—————————————————————————————————
1.采用MicroSoft扩展的javascript的实现：
<<<<<<<<<<<<<<<<<<<<<<<<<<原文：
代码如下：

<body>
<IFRAME id="test" name="test" frameBorder=0 scrolling=no src="