frame是嵌入網頁的框架形式，你可以理解為在原有的web頁面內多出的一個或者多個獨立的小web頁面，從刷新這些小web框架能做到類似“局部刷新”的效果,它的用法與普通的標簽元素DIV類似，可以在指定頁面的相應位置中嵌入、顏色、界面布局，重點在于它是和整個顯示頁面相獨立的。

如下圖代碼里的frame里就是包含的各個獨立的頁面框架如left.html和right.html等；

而ajax是一種局部刷新的技術，它本身而言可以針對這個頁面所有的元素，而不像iframe那樣，只能局部刷新其指定的部分。

Timeout是定時刷新，這個可以根據個人需求添加或者去除Success返回結果里的div(它的id就是maincontent)需要單獨放置在一個新的頁面，這個就是我們要刷新的頁面。

從性能上來說，如果一個頁面比較大，對局部刷新比較多的情況下，有多個地方都可能需要獨立刷新，如果你用太多個iframe的話，對系統的資源消耗會比較大，直接的結果就是頁面加載起來會慢。相反如果在頁面布局不是太復雜，嵌入的獨立板塊不是太多，iframe方法會比ajax局部刷新操作起來要簡便一些，所以在網站設計的過程中，可以根據不同的需要選擇不同的技術方案。

如果你覺得以上內容對您有用，請關注“Web堆兒”，我們的宗旨就是提供網站建設和運營中的各種干貨。

原文地址盛世陽光北京網站建設:http://www.gonet.com.cn/webduirshow-91.html

眾號【傳智播客博學谷】回復關鍵詞：前端 PS Java(100G) Python(80G) 大數據 區塊鏈 測試 PPT JS(40g+300教程) HTML 簡歷 領取相關學習資料！

一、HTML

1、<image>標簽上title屬性與alt屬性的區別是什么？

alt屬性是為了給那些不能看到你文檔中圖像的瀏覽者提供文字說明的。且長度必須少于100個英文字符或者用戶必須保證替換文字盡可能的短。

這包括那些使用本來就不支持圖像顯示或者圖像顯示被關閉的瀏覽器的用戶，視覺障礙的用戶和使用屏幕閱讀器的用戶等。

title屬性為設置該屬性的元素提供建議性的信息。使用title屬性提供非本質的額外信息。參考《alt和title屬性的區別及應用》

2、分別寫出以下幾個HTML標簽：文字加粗、下標、居中、字體

加粗：<b>、<strong>

下標：<sub>

居中：<center>

字體：<font>、<basefont>、參考《HTML標簽列表》

3、請寫出至少5個html5新增的標簽，并說明其語義和應用場景

section：定義文檔中的一個章節

nav：定義只包含導航鏈接的章節

header：定義頁面或章節的頭部。它經常包含 logo、頁面標題和導航性的目錄。

footer：定義頁面或章節的尾部。它經常包含版權信息、法律信息鏈接和反饋建議用的地址。

aside：定義和頁面內容關聯度較低的內容——如果被刪除，剩下的內容仍然很合理。

參考《HTML5 標簽列表》

4、請說說你對標簽語義化的理解？

a. 去掉或者丟失樣式的時候能夠讓頁面呈現出清晰的結構

b. 有利于SEO：和搜索引擎建立良好溝通，有助于爬蟲抓取更多的有效信息：爬蟲依賴于標簽來確定上下文和各個關鍵字的權重；

c. 方便其他設備解析（如屏幕閱讀器、盲人閱讀器、移動設備）以意義的方式來渲染網頁；

d. 便于團隊開發和維護，語義化更具可讀性，遵循W3C標準的團隊都遵循這個標準，可以減少差異化。

5、Doctype作用? 嚴格模式與混雜模式如何區分？它們有何意義?

聲明位于文檔中的最前面，處于 標簽之前。告知瀏覽器以何種模式來渲染文檔。

嚴格模式的排版和 JS 運作模式是，以該瀏覽器支持的最高標準運行。

在混雜模式中，頁面以寬松的向后兼容的方式顯示。模擬老式瀏覽器的行為以防止站點無法工作。

DOCTYPE不存在或格式不正確會導致文檔以混雜模式呈現。

6、你知道多少種Doctype文檔類型？

標簽可聲明三種 DTD 類型，分別表示嚴格版本、過渡版本以及基于框架的 HTML 文檔。

HTML 4.01 規定了三種文檔類型：Strict、Transitional 以及 Frameset。

XHTML 1.0 規定了三種 XML 文檔類型：Strict、Transitional 以及 Frameset。

Standards （標準）模式（也就是嚴格呈現模式）用于呈現遵循最新標準的網頁，

Quirks（包容）模式（也就是松散呈現模式或者兼容模式）用于呈現為傳統瀏覽器而設計的網頁。

7、HTML與XHTML——二者有什么區別

a. XHTML 元素必須被正確地嵌套。

b. XHTML 元素必須被關閉。

c. 標簽名必須用小寫字母。

d. XHTML 文檔必須擁有根元素。

參考《XHTML 與 HTML 之間的差異》

8、html5有哪些新特性、移除了那些元素？

a. HTML5 現在已經不是 SGML 的子集，主要是關于圖像，位置，存儲，多任務等功能的增加。

b. 拖拽釋放(Drag and drop) API

c. 語義化更好的內容標簽（header,nav,footer,aside,article,section）

d. 音頻、視頻API(audio,video)

e. 畫布(Canvas) API

f. 地理(Geolocation) API

g. 本地離線存儲 localStorage 長期存儲數據，瀏覽器關閉后數據不丟失

h. sessionStorage 的數據在頁面會話結束時會被清除

i. 表單控件，calendar、date、time、email、url、search

j. 新的技術webworker, websocket等

移除的元素：

a. 純表現的元素：basefont，big，center, s，strike，tt，u；

b. 對可用性產生負面影響的元素：frame，frameset，noframes；

9、iframe的優缺點？

優點：

a. 解決加載緩慢的第三方內容如圖標和廣告等的加載問題

b. iframe無刷新文件上傳

c. iframe跨域通信

缺點：

a. iframe會阻塞主頁面的Onload事件

b. 無法被一些搜索引擎索引到

c. 頁面會增加服務器的http請求

d. 會產生很多頁面，不容易管理。

參考《iframe的一些記錄》

10、Quirks模式是什么？它和Standards模式有什么區別？

在寫程序時我們也會經常遇到這樣的問題，如何保證原來的接口不變，又提供更強大的功能，尤其是新功能不兼容舊功能時。IE6以前的頁面大家都不會去寫DTD，所以IE6就假定 如果寫了DTD，就意味著這個頁面將采用對CSS支持更好的布局，而如果沒有，則采用兼容之前的布局方式。這就是Quirks模式（怪癖模式，詭異模式，怪異模式）。

區別：總體會有布局、樣式解析和腳本執行三個方面的區別。

a. 盒模型：在W3C標準中，如果設置一個元素的寬度和高度，指的是元素內容的寬度和高度，而在Quirks 模式下，IE的寬度和高度還包含了padding和border。

b. 設置行內元素的高寬：在Standards模式下，給等行內元素設置wdith和height都不會生效，而在quirks模式下，則會生效。

c. 設置百分比的高度：在standards模式下，一個元素的高度是由其包含的內容來決定的，如果父元素沒有設置百分比的高度，子元素設置一個百分比的高度是無效的用

d. 設置水平居中：使用margin:0 auto在standards模式下可以使元素水平居中，但在quirks模式下卻會失效。

11、請闡述table的缺點

a. 太深的嵌套，比如table>tr>td>h3，會導致搜索引擎讀取困難，而且，最直接的損失就是大大增加了冗余代碼量。

b. 靈活性差，比如要將tr設置border等屬性，是不行的，得通過td

c. 代碼臃腫，當在table中套用table的時候，閱讀代碼會顯得異常混亂

d. 混亂的colspan與rowspan，用來布局時，頻繁使用他們會造成整個文檔順序混亂。

e. 不夠語義

參考《為什么說table表格布局不好？》

12、簡述一下src與href的區別

src用于替換當前元素；href用于在當前文檔和引用資源之間確立聯系。

src是source的縮寫，指向外部資源的位置，指向的內容將會嵌入到文檔中當前標簽所在位置

href是Hypertext Reference的縮寫，指向網絡資源所在位置，建立和當前元素（錨點）或當前文檔（鏈接）之間的鏈接

公眾號【傳智播客博學谷】回復關鍵詞：前端 PS Java Python 大數據 區塊鏈 測試 PPT JS HTML 簡歷 領取相關學習資料！

HTML、CSS、JavaScript是前端學習非常重要的內容，作為前端工程師，建立網站，設計網頁需要有一定的審美能力，也需要一定的編程技術。總之，技術性越來越強。學習前端這三大塊內容，可以先從HTML入手，其次是CSS，在打好這兩部分的基礎上，進一步學習JavaScript。

WEB可以被看做是一個有生命的物體或人體，HTML可以視為骨骼和肌肉，CSS可以視為皮膚和毛發，而JavaScript可以視為受一定支配的行為。這樣比喻不一定完全恰當，但可以幫我們更好的理解這三者之間的關系。本文，千鋒武漢HTML5前端培訓小編就來詳細說說HTML、CSS、JavaScript三者之間的區別！

先從HTML說起：

作為網頁內容的載體，HTML包含了用戶需要瀏覽的內容，包括圖文、視頻，即構成網頁的基本元素。HTML是網頁的結構（Structure），需要有多種框架和布局，比如frameset框架集、iframe內聯框架、div+css布局、table布局等，同時支持表單提交（HTML Form），包括基礎表單、input輸入框、輸入框類型、文本域、列表、label等。當前，大家通用的是HTML5，其中還有一些新增元素，比如footer、header等，總之，HTML的功能越來越強大，作為初學者還是要把握主干，有重點地去學習。

其次是CSS：

CSS的作用是效果，或者說是表現（Presentation），比如網頁上的動態文字、文字的色彩、字體、動畫效果。正是因為CSS的存在使得HTML變得豐富多樣。學習CSS，可以從版本CSS3開始，要了解CSS3的動畫效果，如2D變換、過渡、特殊圖形的繪制，雪碧圖、滑動門等等都是常見的效果；除此之外，CSS3還有媒體查詢（Media Queries）、grid，以及多列布局、用戶界面等。CSS部分需要配合HTML，并結合實例來加以學習，這樣效果會跟好。

最后要說一說JavaScript：

如果說一個網頁只有“結構”和“表現”，而缺少了用戶與網頁的交互，即行為（Behavior），那么這樣的網頁就如一潭死水，無法形成良好的用戶體驗。好的用戶體驗不僅可以讓用戶鼠標放在哪里、哪里就會產生人性化的效果，而且可以增強用戶的可操作性，例如購物網站用戶的訂購，網頁會實時顯示用戶的購物動態。這樣一來，JavaScript就有了編程的意味。和其他編程語言一樣，JavaScript也有數據類型、條件語句、分支語句、字符串詳解、數組詳解、對象、函數、數值、Math函數、作用域。如果這一部分可以學會，便可以往更深的內容去發展。

如今，大前端的時代已經來臨，熟練使用HTML5、CSS3，對前端人員的制作要求越來越高，能否做出酷炫的效果成為衡量前端技術的一個標準。作為前端開發工程師，將PC、手機、iPad等多種設備全面掌握并能提供客戶需要的解決方案，精通響應式技術，是必備的能力。如今微信小游戲的開發也是前端開發的重點，值得初學者多多關注。

千鋒武漢HTML5前端培訓小編建議大家重視一下移動端的開發，畢竟移動端的用戶數量高于PC端，移動端更適合碎片化的消費人群，市場較為廣闊。在未來幾十年都將是主流HTML5崗位薪資高，人才缺口超過百萬，現在學習正是最佳時機。所以，你還在等什么？快來學HTML5吧！