服務(wù)項(xiàng)目:網(wǎng)站建設(shè)、仿站、程序開(kāi)發(fā)、APP開(kāi)發(fā)設(shè)計(jì)、移動(dòng)網(wǎng)站開(kāi)發(fā)設(shè)計(jì)、企業(yè)網(wǎng)站設(shè)計(jì)、電子商務(wù)網(wǎng)站開(kāi)發(fā)、網(wǎng)站維護(hù)、網(wǎng)站推廣、UX/UI 、HTML5、CSS3、JS / Jquery ...
四川???萍加邢薰?></a></div>
                    <div   id=四川???萍加邢薰? title=
四川浚??萍加邢薰?(開(kāi)發(fā)設(shè)計(jì)官網(wǎng))TEL : 15308000360 / QQ : 38585404

您的位置:首頁(yè) > 技術(shù)經(jīng)驗(yàn) > 前端開(kāi)發(fā) > 正文

在html文件里include文件內(nèi)容的方法小結(jié)
技術(shù)支持服務(wù)電話(huà):15308000360 【7x24提供運(yùn)維服務(wù),解決各類(lèi)系統(tǒng)/軟硬件疑難技術(shù)問(wèn)題】

在論壇中常常有網(wǎng)友問(wèn)到,可以在一個(gè)html的文件當(dāng)中讀取另一個(gè)html文件的內(nèi)容嗎?答案是確定的,而且方法不只一種,在以前我只會(huì)使用iframe來(lái)引用,后來(lái)發(fā)現(xiàn)了另外的幾種方法,那今天就總結(jié)這幾種方法讓大家參考一下,本人覺(jué)得第三種方式較好!
 
在html文件引入其它html文件的幾種方法
 
1.IFrame引入,看看下面的代碼
 
<pre class="prettyprint html">
<IFRAME NAME="content_frame" width=100% height=40 marginwidth=0 marginheight=0 SRC="import.htm" ></IFRAME>
</pre>
你會(huì)看到一個(gè)外部引入的文件,但會(huì)發(fā)現(xiàn)有一個(gè)類(lèi)似外框的東西將其包圍,可使用
 
<pre class="prettyprint html">
<iframe name="content_frame" marginwidth=0 marginheight=0 width=100% height=40 src="import.htm" frameborder=0></iframe>
</pre>
 
但你會(huì)發(fā)現(xiàn)還會(huì)有點(diǎn)問(wèn)題,就是背景色不同,你只要在引入的文件import.htm中使用相同的背景色也可以,但如果你使用
 
的是IE5.5的話(huà),可以看看這篇關(guān)于透明色的文章 如果想引入的文件過(guò)長(zhǎng)時(shí)不出現(xiàn)滾動(dòng)條的話(huà)在import.htm中的body中加
 
入scroll=no
 
 *缺點(diǎn):無(wú)法做導(dǎo)航跳轉(zhuǎn),在iframe里面跳轉(zhuǎn),內(nèi)容疊加出現(xiàn)
 
2.<object>方式
 
<pre class="prettyprint html">
<object style="border:0px" type="text/x-scriptlet" data="import.htm" width=100% height=30></object>
</pre>
object 標(biāo)簽 — 定義一個(gè)內(nèi)嵌的物件(例如:圖像, 媒體, 代碼 etc)
 
 * 不符合標(biāo)準(zhǔn)網(wǎng)頁(yè)設(shè)計(jì)的理念,已經(jīng)被標(biāo)準(zhǔn)網(wǎng)頁(yè)設(shè)計(jì)拋棄.
 
3.Behavior的download方式
 
 
<pre class="prettyprint html">
<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>
</pre>



上一篇:HTML5+CSS3 實(shí)現(xiàn)安卓小人效果
下一篇:頁(yè)面響應(yīng)式布局CSS樣式通用代碼

相關(guān)熱詞搜索:html