一.为什么需要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的实现:
<<<<<<<<<<<<<<<<<<<<<<<<<<原文:
代码如下:
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>New Page 1</title>
</head>
<body>
<IFRAME id="test" name="test" frameBorder=0 scrolling=no src="http://10.107.2.199:2500/cn/asp/reg.asp" width="100%" height=0></IFRAME>
</body>
</html>
<SCRIPT FOR=window EVENT=onload LANGUAGE="JScript">
document.all("test").height=test.document.body.scrollHeight;
</SCRIPT>
重要提示:src=中你必须填写的网页地址,一定要和本页面在同一个站点上,否则,会抱错,说“拒绝访问!”
之前自己也碰到过这个问题,为了得到答案去网上搜索,发现有不少人也遇到了这样的问题,现在就把解决方法共享一下,超简单哦
1、建立一个bottom.js的文件,然后输入下面的代码(只有两行哦)
parent.document.all("框架ID名").style.height=document.body.scrollHeight;
parent.document.all("框架ID名").style.width=document.body.scrollWidth;
这里的 框架ID名 就是Iframe的ID,比如:
<IFRAME id="框架ID名" name="left" frameBorder=0 scrolling=no src="XXX.asp" width="100%"></IFRAME>
2、给你网站里所有的被包含文件里面每个都加入
<script language = "JavaScript" src = "bottom.js"/></script>
3、OK,收工!
我在WINXP、IE6下面测试通过。很简单吧!<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<原文结束
2.采用检测浏览器版本,加载事件监听器,实现页面载入后,动态扩展。
<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<原文
Iframe自适应高度
<script language="JavaScript">
//** iframe自动适应页面 **//
//输入你希望根据页面高度自动调整高度的iframe的名称的列表
//用逗号把每个iframe的ID分隔. 例如: ["myframe1", "myframe2"],可以只有一个窗体,则不用逗号。
//定义iframe的ID
var iframeids=["content"]
//如果用户的浏览器不支持iframe是否将iframe隐藏 yes 表示隐藏,no表示不隐藏
var iframehide="yes"
function dyniframesize()
{
var dyniframe=new Array()
for (i=0; i<iframeids.length; i++)
{
if (document.getElementById)
{
//自动调整iframe高度
dyniframe[dyniframe.length] = document.getElementById(iframeids[i]);
if (dyniframe[i] && !window.opera)
{
dyniframe[i].style.display="block"
if (dyniframe[i].contentDocument && dyniframe[i].contentDocument.body.offsetHeight) //如果用户的浏览器是NetScape
dyniframe[i].height = dyniframe[i].contentDocument.body.offsetHeight;
else if (dyniframe[i].Document && dyniframe[i].Document.body.scrollHeight) //如果用户的浏览器是IE
dyniframe[i].height = dyniframe[i].Document.body.scrollHeight;
}
}