zzzzz~ may wind
<iframe src="/url" width="x" height="x" scrolling="[option]" frameborder="x"></iframe>
src：文件的路徑，既可是html文件，也可以是文本、asp等；
width、height："畫中畫"區域的寬與高；
scrolling:當src的指定的html文件在指定的區域不顯不完時，滾動選項，如果設置為no，則不出現滾動條；如為auto：則自動出現滾動條；如為yes，則顯示;
frameborder：區域邊框的寬度，為了讓“畫中畫“與鄰近的內容相融合，常設置為0。
比如:
<iframe src="http://www.xyz.com/xyz"; width="250" height="200" scrolling="no" frameborder="0"></iframe>
窗口與浮動幀之間的相互控制
在腳本語言與對象層次中，包含iframe的窗口我們稱之為父窗體，而浮動幀則稱為子窗體，弄清這兩者的關系很重要，因為要在父窗體中訪問子窗體或相反都必須清楚對象層次，才能通過程序來訪問并控制窗體。
1、在父窗體中訪問并控制子窗體中的對象
在父窗體中，iframe即子窗體是document對象的一個子對象，可以直接在腳本中訪問子窗體中的對象。
現在就有一個問題，即，我們怎樣來控制這個iframe，這里需要講一下iframe對象。當我們給這個標記設置了id 屬性后，就可通過文檔對象模型dom對iframe所含的html進行一系列控制。
比如在example.htm里嵌入test.htm文件，并控制test.htm里一些標記對象：
<iframe src="test.htm" id="test" width="250" height="200" scrolling="no" frameborder="0"></iframe>
test.htm文件代碼為:
<html>
<body>
<h1 id="myh1">hello,my boy</h1>
</body>
</html>
如我們要改變id號為myh1的h1標記里的文字為hello,my dear，則可用:
document.myh1.innertext="hello,my dear"(其中，document可省)
在example.htm文件中，iframe標記對象所指的子窗體與一般的dhtml對象模型一致，對對象訪問控制方式一樣，就不再贅述。
2、在子窗體中訪問并控制父窗體中對象
在子窗體中我們可以通過其parent即父（雙親）對象來訪問父窗口中的對象。
如example.htm：
<html>
<body > <iframe name="tt" src="frame1.htm" width="250" height="200" scrolling="no" frameborder="0"></iframe>
<h1 id="myh2">hello,my wife</h1>
</body>
</html>
如果要在frame1.htm中訪問id號為myh2中的標題文字并將之改為"hello,my friend"，我們就可以這樣寫：
parent.myh2.innertext="hello,my friend"
這里parent對象就代表當前窗體(example.htm所在窗體)，要在子窗體中訪問父窗體中的對象，無一例外都通過parent對象來進行。
iframe雖然內嵌在另一個html文件中，但它保持相對的獨立，是一個“獨立王國“喲，在單一html中的特性同樣適用于浮動幀中。
試想一下，通過iframe標記，我們可將那些不變的內容以iframe來表示，這樣，不必重復寫相同的內容，這有點象程序設計中的過程或函數，減省了 多少繁瑣的手工勞動！另外，至關重要的是，它使頁面的修改更為可行，因為，不必因為版式的調整而修改每個頁面，你只需修改一個父窗體的版式即可了。
要注意的是，nestscape6.0之前版本不支持iframe標記。
例子：
<iframe src="頁面" width="寬度" height="高度" align="排列可以是left或right,center" scrolling="是否有滾動條可以填no或yes"></iframe>
<iframe frameborder=0 framespacing=0 height=25 marginheight=0 marginwidth=0 scrolling=no
name=main src="/bgm/bgm.html" width=300></iframe>
用了iframe后 發現滾動條不漂亮 想用2個圖片來代替↑↓
應該怎么實現呢？
回答：
用下列代碼替換網頁的<title>..</title>
<script language="javascript">
function scroll(n)
{temp=n;
out1.scrolltop=out1.scrolltop+temp;
if (temp==0) return;
settimeout("scroll(temp)",80);
}
</script>
<table width="330">
<tr>
<td width="304" valign="top" rowspan="2" >
<div id=out1 style="width:100%; height:100;overflow: hidden ;border-style:dashed;border-width:
1px,1px,1px,1px;">
文字<br> 文字<br>
文字<br>
文字<br>
文字
<br>
<br>
</div>
</td>
< td width="14" valign="top"><img src="http://www.49028c.com/htmldata/2007-04-25/photo/up0605.gif" width="14" height ="20" onmouseover="scroll(-1)" onmouseout="scroll(0)" onmousedown="scroll (-3)" border="0" alt="按下鼠標速度會更快！"></td>
</tr>
<tr>
< td width="14" valign="bottom"><img src="http://www.49028c.com/htmldata/2007-04-25/photo/down0605.gif" onmouseover ="scroll(1)" onmouseout="scroll(0)" onmousedown="scroll(3)" border="0" width ="15" height="21" alt="按下鼠標速度會更快！"></td>
</tr>
</table>
下面這段代碼可以實現iframe自適應高度，即隨著頁面的長度，自動適應以免除頁面和iframe同時出現滾動條。
源代碼如下
<script type="text/javascript">
//** iframe自動適應頁面 **//
//輸入你希望根據頁面高度自動調整高度的iframe的名稱的列表
//用逗號把每個iframe的id分隔. 例如: ["myframe1", "myframe2"]，可以只有一個窗體，則不用逗號。
//定義iframe的id
var iframeids=["test"]
//如果用戶的瀏覽器不支持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);
if (dyniframe && !window.opera)
{
dyniframe.style.display="block"
if (dyniframe.contentdocument && dyniframe.contentdocument.body.offsetheight) //如果用戶的瀏覽器是netscape
dyniframe.height = dyniframe.contentdocument.body.offsetheight;
else if (dyniframe.document && dyniframe.document.body.scrollheight) //如果用戶的瀏覽器是ie
dyniframe.height = dyniframe.document.body.scrollheight;
}
}
//根據設定的參數來處理不支持iframe的瀏覽器的顯示問題
if ((document.all || document.getelementbyid) && iframehide=="no")
{
var tempobj=document.all? document.all[iframeids] : document.getelementbyid(iframeids)
tempobj.style.display="block"
}
}
}
if (window.addeventlistener)
window.addeventlistener("load", dyniframesize, false)
else if (window.attachevent)
window.attachevent("onload", dyniframesize)
else
window.onload=dyniframesize
</script>
其他有參考價值的網址:
http://www.webshu.com/tutorial/tor/7,id=0408.htm //iframe嵌入網頁的用法
http://www.phpx.com/man/dhtmlcn/objects/iframe.html //iframe對象
http://www.hoyo.idv.tw/web-program/html/iframe.htm //內嵌框架iframe
新聞熱點
疑難解答
