一: <Frameset>爲框架標記，說明該網頁文檔爲框架組成，並設定文檔中組成框架集的框架的佈局，用來劃分框架，每一個框架由<Frame></Frame>標記。
<Frame>用以設置組成框架集中各個框架的屬性。<Frame></Frame>必須在<Frameset></Frameset>之內使用。比如：
<FRAMESET border=1 frameSpacing=1borderColor=#47478d rows=* cols=180,*>
<FRAME src="inc/admin_left.htm"name=left scrolling=no id="left">
<FRAME src="inc/admin_center.htm"name=main scrolling="no">
</FRAMESET>
<FRAME src="inc/admin_left.htm"name=left scrolling=no id="left">
<FRAME src="inc/admin_center.htm"name=main scrolling="no">
</FRAMESET>
在這個例子當中，<Frameset></Frameset>把頁面分爲左右兩個部分，左側框架中的頁面是admin_left.htm，右側框架中的頁面是admin_center.htm。
注意：<Frame></Frame>標記的框架順序爲從左至右或從上到下。
二: Iframe是Inline Frame的縮寫，稱爲內聯框架，它和frame如同兄弟。frame是幀標記，Iframe叫浮動幀標記，它不同於Frame標記最大的特徵即這個標記所引用的HTML文件不是與另外的HTML文件相互獨立顯示，而是可以直接嵌入在一個HTML文件中，與這個HTML文件內容相互融合，成爲一個整體；因爲它可以多次在一個頁面內顯示同一內容，而不必重複寫內容，所以人們形象稱這種效果爲“畫中畫”。 Iframe標記使用格式，比如：
<Iframe src="URL" width="x" height="x" scrolling="[OPTION]"frameborder="x"name= "main"></iframe>
在這個例子中，各個含義是:
src： 文件的路徑，既可是HTML文件，也可以是文本、ASP等；
width、height：“內部框架”區域的寬與高；
scrolling：當SRC的指定的HTML文件在指定的區域內顯示不完時的滾動選項，如果設置爲NO，則不出現滾動條；如爲Auto：則自動出現滾動條；如爲Yes，則顯示滾動條。
FrameBorder：區域邊框的寬度，只有0和1兩個值，分別表示沒有邊框和有邊框，爲了讓“內部框架”與鄰近的內容相融合，常設置爲0。
name：框架的名字，用來進行識別。
src： 文件的路徑，既可是HTML文件，也可以是文本、ASP等；
width、height：“內部框架”區域的寬與高；
scrolling：當SRC的指定的HTML文件在指定的區域內顯示不完時的滾動選項，如果設置爲NO，則不出現滾動條；如爲Auto：則自動出現滾動條；如爲Yes，則顯示滾動條。
FrameBorder：區域邊框的寬度，只有0和1兩個值，分別表示沒有邊框和有邊框，爲了讓“內部框架”與鄰近的內容相融合，常設置爲0。
name：框架的名字，用來進行識別。
三: 下面是我寫通訊錄時用到的iframe知識點，我抽取了出來，用兩組父子頁面展示給大家：[分兩組頁面,分別是在父子頁面中操作]
1.child1.html
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
function c(){
alert(document.getElementById("childTextId").value);
}
</script>
</head>
<body>
<form action="">
<input type="text" value="child text" id="childTextId" name="childTextName">
<input type="text" id="childTextId2" name="childTextName2">
<input type="text" id="childTextId3" name="childTextName3">
</form>
</body>
</html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
function c(){
alert(document.getElementById("childTextId").value);
}
</script>
</head>
<body>
<form action="">
<input type="text" value="child text" id="childTextId" name="childTextName">
<input type="text" id="childTextId2" name="childTextName2">
<input type="text" id="childTextId3" name="childTextName3">
</form>
</body>
</html>
parent1.html
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
function p(){
//在父頁面中,取得子頁面的內容賦給父頁面[方式一]
document.getElementById('parentTextId1').value=window.frames["iframeName"].document.all('childTextName').value;
//在父頁面中,取得子頁面的內容賦給父頁面[方式二]
document.getElementById('parentTextId2').value=iframeName.document.getElementById("childTextId").value;
}
function p2(){
//在父頁面中,調用iframe子頁面的JS函數
iframeName.window.c();
}
function p3(){
//在父頁面中,取得本頁面的內容賦給子頁面[方式一]
window.frames["iframeName"].document.all('childTextName2').value=document.getElementById('parentTextId1').value;
//在父頁面中,取得本頁面的內容賦給子頁面[方式二]
iframeName.document.getElementById("childTextId3").value=document.getElementById('parentTextId2').value;
}
</script>
</head>
<body>
<form action="">
<input type="text" id="parentTextId1">
<input type="text" id="parentTextId2">
<input type="button" onclick="p();" value="p">
<input type="button" onclick="p2();" value="p2">
<input type="button" onclick="p3();" value="p3">
</form>
<iframe src="c.html" name="iframeName"></iframe>
</body>
</html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
function p(){
//在父頁面中,取得子頁面的內容賦給父頁面[方式一]
document.getElementById('parentTextId1').value=window.frames["iframeName"].document.all('childTextName').value;
//在父頁面中,取得子頁面的內容賦給父頁面[方式二]
document.getElementById('parentTextId2').value=iframeName.document.getElementById("childTextId").value;
}
function p2(){
//在父頁面中,調用iframe子頁面的JS函數
iframeName.window.c();
}
function p3(){
//在父頁面中,取得本頁面的內容賦給子頁面[方式一]
window.frames["iframeName"].document.all('childTextName2').value=document.getElementById('parentTextId1').value;
//在父頁面中,取得本頁面的內容賦給子頁面[方式二]
iframeName.document.getElementById("childTextId3").value=document.getElementById('parentTextId2').value;
}
</script>
</head>
<body>
<form action="">
<input type="text" id="parentTextId1">
<input type="text" id="parentTextId2">
<input type="button" onclick="p();" value="p">
<input type="button" onclick="p2();" value="p2">
<input type="button" onclick="p3();" value="p3">
</form>
<iframe src="c.html" name="iframeName"></iframe>
</body>
</html>
2.child2.html
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
function c1(){
//在子頁面中,取得本頁面的內容賦給父頁面
parent.document.getElementById("t").innerHTML=document.getElementById('childTextId').value;
}
function c2(){
//在子頁面中,調用iframe父頁面的JS函數
window.parent.showTextarea();
}
</script>
</head>
<body>
<form action="">
<input type="text" id="childTextId" name="childTextName" value="childText">
<input type="button" onclick="c1();" value="c1">
<input type="button" onclick="c2();" value="c2">
</form>
</body>
</html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
function c1(){
//在子頁面中,取得本頁面的內容賦給父頁面
parent.document.getElementById("t").innerHTML=document.getElementById('childTextId').value;
}
function c2(){
//在子頁面中,調用iframe父頁面的JS函數
window.parent.showTextarea();
}
</script>
</head>
<body>
<form action="">
<input type="text" id="childTextId" name="childTextName" value="childText">
<input type="button" onclick="c1();" value="c1">
<input type="button" onclick="c2();" value="c2">
</form>
</body>
</html>
parent2.html
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
function showTextarea(){
alert(document.getElementById("t").value);
}
</script>
</head>
<body>
<textarea rows="0" cols="0" id="t"></textarea>
<iframe src="c2.html" name="iframeName"></iframe>
</body>
</html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
function showTextarea(){
alert(document.getElementById("t").value);
}
</script>
</head>
<body>
<textarea rows="0" cols="0" id="t"></textarea>
<iframe src="c2.html" name="iframeName"></iframe>
</body>
</html>