iframe 和 frameset 都用于html頁(yè)面的框架布局
1.<iframe> 標(biāo)簽
iframe 是個(gè)內(nèi)聯(lián)框架，是在頁(yè)面里生成個(gè)內(nèi)部框架。
1.1格式：<iframe></iframe>
1.2主要屬性：
frameborder ：是否顯示框架的邊框；
src ：指定一個(gè)資源(如網(wǎng)頁(yè)、圖片)的uri；
scrolling ：是否顯示框架的滾動(dòng)條；
width：定義iframe的寬度；
height：定義iframe的高度；
1.3優(yōu)點(diǎn)：縮短頁(yè)面的整體長(zhǎng)度。
代碼示例：
<body><h3>HTML標(biāo)簽演示</h3><iframe src=1.1-ShowHtml.htm ></iframe></body>
1.4 注意事項(xiàng)
在 "<iframe>我是內(nèi)容</iframe>" 內(nèi)添加內(nèi)容時(shí)，在展示頁(yè)面不會(huì)顯示添加的內(nèi)容。所以還是使用src屬性指定一個(gè)頁(yè)面吧。
1.5 應(yīng)用場(chǎng)景：
①版本升級(jí)頁(yè)面，版本日志過(guò)多，可以把升級(jí)的信息放到一個(gè)iframe里。
②富文本編輯框，如博客園的【新建隨筆】區(qū)域。
2.<frameset> 標(biāo)簽
frameset 定義一個(gè)框架集，包含多個(gè)框架，每個(gè)框架都有獨(dú)立的文檔。
2.1格式：
<frameset >
<frame src=a.htm />
<frame src=b.htm />
<noframes></noframes>
</frameset>
2.2 子項(xiàng)說(shuō)明：
<frame src=a.htm /> ：子框架
<noframes></noframes>：瀏覽器不支持此框架的時(shí)，顯示的內(nèi)容。
注意：必須包含<body></body>標(biāo)簽。
2.3 屬性：
frameset 屬性：
rows ：表示子框架按行的樣式布局（
）。以2個(gè)子框架為例：rows="30%,*" ，表示第一個(gè)框架占整個(gè)頁(yè)面30%的高度，第二個(gè)占剩下的；
cols ：表示子框架按列的樣式布局(
)。以2個(gè)子框架為例：cols="30%,*" ，表示第一個(gè)框架占整個(gè)頁(yè)面30%的長(zhǎng)度，第二個(gè)占剩下的；
noresize="noresize" ：表示不調(diào)整子框架的范圍。
frame 屬性：
src ：指向一個(gè)資源(如頁(yè)面、圖片等)的URI；
name ：指定框架的名稱，以便進(jìn)行框架間的操作。
代碼示例：
<html xmlns="http://www.w3.org/1999/xhtml"><head> <title>frameset 演示</title></head><frameset rows="30%,*" noresize="noresize"> <frame src=DateGrid.htm name="frm1" /> <frame src=Dialog.htm name="frm2"/> <noframes></noframes></frameset></html>
2.4 注意事項(xiàng)：
使用frameset標(biāo)簽時(shí)，注意要去掉外層的<body></body>標(biāo)簽。
2.5 子框架集間的操作
參照示例代碼，frm1更改frm2的子集指向的頁(yè)面：window.parent.frames["frm2"].location.href = 'b.htm'
2.6 應(yīng)用場(chǎng)景
①后臺(tái)頁(yè)面的管理，左邊顯示 菜單，右邊框架 顯示詳細(xì)頁(yè)面。
②功能菜單頁(yè)面，如bbs.csdn.net
3.小知識(shí)
瀏覽頁(yè)面中的框架時(shí)，在框架頁(yè)面內(nèi) 點(diǎn)擊右鍵，會(huì)多出框架的信息。
以chrome為例：
==================================系列文章==========================================
本篇文章：1.3 HTML iframe 和 frameset 的區(qū)別
Web開(kāi)發(fā)之路系列文章1.HTML
1.1
HTML頁(yè)面源代碼布局介紹1.2
HTML基礎(chǔ)控件介紹1.3
iframe 和 frameset 的區(qū)別1.4
name、id、class 的區(qū)別1.5
table、form表單標(biāo)簽的介紹以及get和post提交方式2.CSS 層疊樣式表
2.1
CSS 選擇器及各樣式引用方式2.2
CSS HTML元素布局及Display屬性2.3
CSS Float 浮動(dòng)屬性2.4
CSS Position 定位屬性3.JavaScript介紹
3.1
JavaScript var關(guān)鍵字、變量的狀態(tài)、異常處理、命名規(guī)范等介紹3.2
JavaScript function函數(shù)種類(lèi)3.3
JavaScript Array對(duì)象3.4
JavaScript Date對(duì)象3.5
JavaScript Math和Number對(duì)象3.6
JavaScript String對(duì)象3.7
JavaScript Object對(duì)象3.8
JavaScript 自定義對(duì)象3.9
JavaScript 屬性介紹3.10
JavaScript 開(kāi)發(fā)規(guī)范4.Dom
4.1 Window對(duì)象 : 對(duì)瀏覽器的當(dāng)前窗口進(jìn)行操作。
4.2 Navigator對(duì)象 ：對(duì)瀏覽器進(jìn)行操作。包括獲取瀏覽器的名稱、平臺(tái)、版本信息等等。
4.3 Screen對(duì)象 ：對(duì)顯示器屏幕進(jìn)行操作。包括獲取屏幕的高度、寬度。
4.4 Location對(duì)象 ：對(duì)當(dāng)前頁(yè)面的URL進(jìn)行操作。
4.5 Document對(duì)象 ： 對(duì)HTML內(nèi)的元素進(jìn)行操作。
4.6 Event對(duì)象 ：HTML元素的事件操作。
5.Jquery
5.1 Jquery選擇器
5.2 常用的方法
5.3 對(duì)數(shù)組、字典進(jìn)行操作
5.4 指定一個(gè)對(duì)象，獲取相鄰元素
5.5 動(dòng)態(tài)操作HTML元素
5.6 事件操作
5.7 動(dòng)畫(huà)操作
5.8 Css操作
5.9 擴(kuò)展插件
6.EasyUI 框架
7.其他技術(shù)
7.1 Ajax
7.2 正則表達(dá)式
只是記錄了自己在學(xué)習(xí)、使用Web前端內(nèi)容時(shí)的心得和碰到的問(wèn)題。
參考文獻(xiàn)：
1）
http://www.w3school.com.cn/2）《JavaScript權(quán)威指南(第六版)》
