日期:2014-05-17 浏览次数:20691 次
要在html包含文件,参考:
在宿主页面中嵌入外部页面 ?
刘筱??
??? 如今在Internet上建立网站已经是很平常的事了,但是要做好却并不容易。除了要求网站的内容丰富、可读性强外,网站美观和艺术性也是不可缺少的。而做到美观的一个重要方面就是使整个网站具有统一的风格,并具有一致的导航结构及相关版权信息提示。??
????? 在这方面,FrontPage的模板就是为统一规划网站整体风格而设计的。但使用FrontPage的这一功能也存在明显的缺点,即当需要改变网站风格时,要对所有的页面进行修改。如果网站的页面很多,逐一修改页面将是非常烦琐的工作。对于这种情况,制作者可以在服务器端(ASP)通过使用“include”包含指令来嵌入另一控制网站整体风格的页面来达到简化修改目的,这样在修改网站风格时,只须把嵌入的外部页面修改即可,而不用对网站中所有的页面进行修改。遗憾的是免费主页空间一般都不提供对ASP、PHP、CGI等支持,那么在宿主页面中嵌入外部页面的操作能否在客户端实现呢?如果能,又怎样实现呢?下面我们就谈谈在客户端实现在宿主页面中嵌入外部页面的各种方法,并讨论它们的优缺点。 ?
一.应用框架技术???
???? 要在宿主页面中嵌入外部页面的方法是,在宿主页面中包含外部页面的位置插入“ < ? IFRAME ? name= "XXX " ? width=X ? height=X ? frameborder=0 ? src= "XXX.htm " ? > < ? /IFRAME ? > ”语句即可(注意: ? < ? IFRAME ? > 标签中的各种属性含义请查阅相关技术手册)。???
?? 如果想在嵌入的外部页面过长时不出现滚动条,在外部文件 < ? body ? > 标签中加入“scroll=no”或者在宿主页面 < ? IFRAME ? > 标签中加入“scrolling=no”即可。???
?? 但这样做会出现一个问题,就是宿主页面和外部页面背景色不同,这样会给人造成页面不是一个整体的感觉。这时,只要在引入的外部文件中使用和宿主页面相同的背景色就可以解决这一问题。注意,如果您使用的是IE ? 5.5或以上版本的话,直接在标签 < ? IFRAME ? > 内设置属性allowTransparency= "true "(即框架背景透明)即可。???
?? 在应用框架技术时,为什么不使用框架页面(即 < ? FRAMESET ? > )呢?现在有很多网站是通过使用框架页面来分割版面的,并达到了统一网站整体风格的目的,但笔者的体会是框架页面的操作灵活性较差,不像内建框架(即 < ? IFRAME ? > )这样可以在宿主页面中的任何位置插入。 ?
二.使用Scriptlets组件技术???
?? 应用这种技术的方法是在宿主页面中包含外部页面的位置插入“ < ? OBJECT ? style= "border: ? 0px " ? type= "text/x-scriptlet " ? data= "XXX.htm " ? width=X ? Height=X ? > < ? /OBJECT ? > ”语句即可(注意: ? < ? OBJECT ? > 标签中的各种属性含义请查阅相关技术手册)。 ?
---- ? 在IE ? 5.0及以后版本中,scriptlets和Html组件(HTCs)被重新命名为Windows脚本编程组件(WSC),其特点类似于上文所讲的框架技术。它有自己的不透明方形区域,并覆盖在宿主页面上,因此不能很平滑地用于具有纹理背景的宿主页面中,其工作方式类似于ActiveX控件,具有自己独立的事件、方法和属性。 ?
三.使用脚本文件技术 ?
---- ? 我们知道document.write方法可以在宿主页面中输出内容,这样就可以通过在宿主页面中引入外部脚本文件来达到嵌入外部页面的目的。方法是在宿主页面中包含外部页面的位置插入“ < ? SCRIPT ? language= "javascript " ? src= "import.js " ? > < ? /SCRIPT ? > ”,然后对外部页面进行改造,将每一行内容写入document.write中,并另外保存在扩展名为js的新文件中。???
?? 这种方法的特点是外部页面不具有自己的方形区域,和宿主页面浑然一体,但由于外部页面内容全部写在脚本中,无法做到所见即所得,必须等到脚本运行时才能看到实际效果,这样就为修改调试增加了困难。 ?
四.使用内置行为技术???
? 在IE ? 5.0及以后版本,引入了一项被称为“DHTML行为”的新功能,并在其中内置了许多默认行为。当将一种行为应用于宿主页面上的标准HTML元素时,它可以增强该元素的默认功能,并提供该行为中定义的任何新方法、属性或事件。其实大家对行为技术并不陌生,微电脑世界2001年18期的《主页加入收藏设置面面观》一文就提到了利用IE中内置的homepage行为技术进行主页设置的方法。我们同样可以利用IE ? 5.0内置的download行为,来达到在宿主页面中嵌入外部页面的目的,其代码如下。???
?? < ? Span ? id=showImport ? > < ? /Span ? >???
?? < ? IE: ? Download ? ID= "oDownload " ? STYLE= "behavior: ? url(#default#download) " ? / ? >???
?? < ? Script ? >???
?? function ? onDownloadDone(downDate){???
?? showImport.innerHTML=downDate;???
? }???
? oDownload.startDownload( 'import.htm ',onDownloadDone)???
?? < ? /Script ? >???
?? ?其原理就是使用download行为提供的startDownload方法下载一个外部文本文件,并将文件中的文本内容作为参数传递给onDownloadDone函数,然后再由该函数对文本内容进行处理,在本例中是作为showImport对象的内容显示出来。如果在函数中对文本内容做相应的处理,并与相关技术结合,如XML,就可以实现更为复杂的功能。???
? ? 这种方法使得外部页面不再具有自己的方形区域,和宿主页面浑然一体; ? 提供了更大的灵活性,通过使用对象的innerHtml属性可以真正做到在宿主页面的任何位置插入外部文件内容; ? 修改简单,只须用可视网页编辑软件(如FrontPage ? 2000)将外部页面修改即可轻松改变网站整体风格。可以说这是在宿主页面中嵌入外部页