html篇--這多是目前較爲全面的html面試知識點了吧

也不知道有沒有跟小編有同感的童鞋,隨着技術的逐(ri)漸(yi)提(tui)升(bu),對於一些底層的概念性的知識點卻有些遺忘。有時候知道是這麼個意思,可是表述出來的時候也沒能完整的說到點子上。出現此現象的時候,小編以爲是時候該作點什麼了(嗯!)。css

如下是小編就這HTML常見的問題整理出來的知識點,後繼還會出CSSJS相關係列的文章,用於整理以及鞏固基礎。本篇着重針對的是萌新以及像小編同樣對於一些基礎概念性的東西有遺忘的童鞋,亦可做爲處於跳槽階段的童鞋做爲溫習的文章,如有記憶超凡的大佬請跳過。html

小建議: 鑑於文章多以文字爲主,建議能夠收藏,分次閱讀,提升閱讀效率。文中小編已標註好分割線前端


1. HTML、XML、XHTML 的區別

  • HTML:超文本標記語言,是語法較爲鬆散的、不嚴格的Web語言;
  • XML:可擴展的標記語言,主要用於存儲數據和結構,可擴展;
  • XHTML:可擴展的超文本標記語言,基於XML,做用與HTML相似,但語法更嚴格。

2. 什麼是HTML5以及和HTML的區別是什麼

概念

HTML5HTML的新標準,其主要目標是無需任何額外的插件如FlashSilverlight等,就能夠傳輸全部內容。它囊括了動畫、視頻、豐富的圖形用戶界面等。html5

HTML5是由萬維網聯盟(W3C)Web Hypertext Application Technology Working Group 合做建立的HTML新版本。web

區別

從文檔聲明類型上看面試

  • HTML是很長的一段代碼,很難記住。以下代碼:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
複製代碼
  • HTML5卻只有簡簡單單的聲明,方便記憶。以下:
<!DOCTYPE html>
複製代碼

從語義結構上看數據庫

  • HTML4.0:沒有體現結構語義化的標籤,一般都是這樣來命名的<div id="header"></div>,這樣表示網站的頭部。
  • HTML5:在語義上卻有很大的優點。提供了一些新的標籤,好比:<header><article><footer>

拓展: 不輸入<!DOCTYPE HTML>,瀏覽器將沒法識別html文件,所以html將沒法正常工做。編程

3. HTML、XHTML和HTML5區別以及有什麼聯繫

XHTML與HTML的區別

  • XHTML標籤名必須小寫;
  • XHTML元素必須被關閉;
  • XHTML元素必須被正確的嵌套;
  • XHTML元素必需要有根元素。

XHTML與HTML5的區別

  • HTML5新增了canvas繪畫元素;
  • HTML5新增了用於繪媒介回放的videoaudio元素;
  • 更具語義化的標籤,便於瀏覽器識別;
  • 對本地離線存儲有更好的支持;
  • MATHMLSVG等,能夠更好的render
  • 添加了新的表單控件:calendardatetimeemail等。

HTML、XHTML、HTML5之間聯繫

  • XHTMLHTML規範版本;
  • HTML5HTMLXHTML以及HTML DOM的新標準。

4. HTML5 爲何只須要寫

這是由於HTML5不基於SGML,所以不須要對DTD進行引用,可是須要DOCTYPE來規範瀏覽器的行爲(讓瀏覽器按照他們應該的方式來運行)而HTML4.01基於SGML,因此須要對DTD進行引用,才能告知瀏覽器文檔所使用的文檔類型。canvas

5. 行內元素有哪些?塊級元素有哪些? 空(void)元素有那些?

  • 行內元素: a, b, span, img, input, select, strong;
  • 塊級元素: div, ul, li, dl, dt, dd, h1-5, p等;
  • 空元素: <br>, <hr>, <img>, <link>, <meta>;

6. 頁面導入樣式時,使用link和@import有什麼區別

  • link屬於HTML標籤,而@importcss提供的;
  • 頁面被加載時,link會同時被加載,而@import引用的css會等到頁面被加載完再加載;
  • @import只在IE5以上才能識別,而linkXHTML標籤,無兼容問題;
  • link方式的樣式的權重高於@import的權重。

7. 支持HTML5的瀏覽器有哪些

如今幾乎全部現有的瀏覽器都支持HTML5,例如Chrome, Opera, Safari, IE, 火狐等;跨域

8. Label 的做用是什麼? 怎麼用?

label 標籤來定義表單控制間的關係,當用戶選擇該標籤時,瀏覽器會自動將焦點轉到和標籤相關的表單控件上。

<label for="Name">Number:</label> 
<input type=「text「 name="Name" id="Name"/>
複製代碼

9. 標籤上title屬性與alt屬性的區別是什麼

  • alt是爲了在圖片未能正常顯示時(屏幕閱讀器)給予文字說明。且長度必須少於100個英文字符或者用戶必須保證替換文字儘量的短。
  • title屬性爲設置該屬性的元素提供建議性的信息。使用title屬性提供非本質的額外信息。

10. 如何理解語義化標籤

概念

語義化是指根據內容的結構化(內容語義化),選擇合適的標籤(代碼語義化),便於開發者閱讀和寫出更優雅的代碼的同時,讓瀏覽器的爬蟲和機器很好的解析。

語義化的好處

  • 用正確的標籤作正確的事情;
  • 去掉或者丟失樣式的時候可以讓頁面呈現出清晰的結構;
  • 方便其餘設備解析(如屏幕閱讀器、盲人閱讀器、移動設備)以意義的方式來渲染網頁;
  • 有利於SEO:和搜索引擎創建良好溝通,有助於爬蟲抓取更多的有效信息:爬蟲依賴於標籤來肯定上下文和各個關鍵字的權重;
  • 便於團隊開發和維護,語義化更具可讀性,遵循W3C標準的團隊都遵循這個標準,能夠減小差別化。


11. 文檔聲明(Doctype)和<!Doctype html>有何做用? 嚴格模式與混雜模式如何區分?它們有何意義?

文檔聲明的做用

文檔聲明是爲了告訴瀏覽器,咱們寫的HTML文檔當前使用什麼版本的HTML來寫的,這樣瀏覽器才能按照咱們聲明的版原本正確的解析。

<!Doctype html>的做用

<!doctype html> 的做用就是讓瀏覽器進入標準模式,使用最新的 HTML5標準來解析渲染頁面;若是不寫,瀏覽器就會進入混雜模式,咱們須要避免此類狀況發生。

嚴格模式與混雜模式的區分

嚴格模式: 又稱爲標準模式,指瀏覽器按照W3C標準解析代碼;

混雜模式: 又稱怪異模式、兼容模式,是指瀏覽器用本身的方式解析代碼.混雜模式一般模擬老式瀏覽器的行爲,以防止老站點沒法工做;

區分

網頁中的DTD,直接影響到使用的是嚴格模式仍是瀏覽模式,能夠說DTD的使用與這兩種方式的區別息息相關。

  • 若是文檔包含嚴格的DOCTYPE ,那麼它通常以嚴格模式呈現(嚴格 DTD ——嚴格模式);
  • 包含過渡 DTDURIDOCTYPE ,也以嚴格模式呈現,但有過渡 DTD 而沒有 URI (統一資源標識符,就是聲明最後的地址)會致使頁面以混雜模式呈現(有 URI 的過渡 DTD ——嚴格模式;沒有 URI 的過渡 DTD ——混雜模式);
  • DOCTYPE 不存在或形式不正確會致使文檔以混雜模式呈現(DTD不存在或者格式不正確——混雜模式);
  • HTML5 沒有 DTD ,所以也就沒有嚴格模式與混雜模式的區別,HTML5 有相對寬鬆的語法,實現時,已經儘量大的實現了向後兼容(HTML5 沒有嚴格和混雜之分)。

總的來講,嚴格模式讓各個瀏覽器統一執行一套規範.兼容模式保證了舊網站的正常運行。

12. 如何實現瀏覽器內多個標籤頁之間的通訊

能夠經過調用localstorgecookies等本地存儲方式。

13. webSocket如何兼容低瀏覽器

  • Adobe Flash Socket
  • ActiveX HTMLFile (IE)
  • 基於 multipart 編碼發送 XHR
  • 基於長輪詢的 XHR;

14. iframe有哪些優缺點

優勢

  • iframe能夠實現無刷新文件上傳;
  • iframe能夠跨域通訊;
  • 解決了加載緩慢的第三方內容如圖標和廣告等的加載問題。

缺點

  • iframe會阻塞主頁面的Onload事件;
  • 沒法被一些搜索引擎索引到;
  • 頁面會增長服務器的http請求;
  • 會產生不少頁面,不容易管理。

15. src與href有什麼區別

  • src用於替換當前元素;href用於在當前文檔和引用資源之間確立聯繫;
  • srcsource的縮寫,指向外部資源的位置,指向的內容將會嵌入到文檔中當前標籤所在位置;而hrefHypertext Reference的縮寫,指向網絡資源所在位置,創建和當前元素(錨點)或當前文檔(連接)之間的連接。

16. table的做用以及其優缺點

做用

  • 可用於佈局(已過期);
  • 用於顯示批量數據;

優勢

在某些場合,使用Table是100%的適合、恰當和正確。好比,用table作表格是徹底正確的

缺點

  • Table要比其它html標記佔更多的字節,會致使延遲下載時間,佔用服務器更多的流量資源;
  • Table會阻擋瀏覽器渲染引擎的渲染順序,這會致使延遲頁面的生成速度,讓用戶等待更久的時間;
  • 靈活性差,好比要通多td才能設置trborder屬性;
  • 代碼臃腫,當在table中套用table的時候,閱讀代碼會顯得異常混亂;
  • 混亂的colspanrowspan,用來佈局時,頻繁使用他們會形成整個文檔順序混亂;
  • 深層的嵌套,致使搜索引擎讀取困難,同時還很大程度上增長了代碼冗餘;
  • 不夠語義。

17. 瀏覽器亂碼的緣由是什麼?如何解決?

產生亂碼的緣由

  • 網頁源代碼是gbk的編碼,而內容中的中文字是utf-8編碼的,這樣瀏覽器打開即會出現html亂碼。反之也會出現亂碼;
  • html網頁編碼是gbk,而程序從數據庫中調出呈現是utf-8編碼的內容也會形成編碼亂碼;
  • 瀏覽器不能自動檢測網頁編碼,形成網頁亂碼。

解決辦法

  • 使用軟件進行編輯HTML網頁內容;
  • 若是網頁設置編碼是gbk,而數據庫儲存數據編碼格式是UTF-8,此時須要程序查詢數據庫數據顯示數據前進程序轉碼;
  • 若是瀏覽器瀏覽時候出現網頁亂碼,在瀏覽器中找到轉換編碼的菜單進行轉換;

18. HTML和DOM有何關係?

HTML是死的,只是一個字符串;而DOM是由html解析而來,是活的,咱們能夠經過Javascript維護DOM

19. property和attribute的區別是什麼

  • propertyDOM中的屬性,是JavaScript裏的對象;
  • attributeHTML標籤上的特性,它的值只可以是字符串;

簡單的理解就是:Attribute就是DOM節點自帶的屬性,例如html中經常使用的idclasstitlealign等;而Property是這個DOM元素做爲對象,其附加的內容,例如childNodesfirstChild等。

20. HTML元素如何提現其嵌套關係

  • 塊級元素能夠包含行內元素;
  • 塊級元素不必定能包含塊級元素;
  • 行內元素通常不能包含塊級元素(a元素例外)


21. 幾種Doctype文檔類型

標籤可聲明三種 DTD 類型,分別表示嚴格版本過渡版本以及基於框架的 HTML 文檔

  • HTML 4.01 規定了三種文檔類型:分別是StrictTransitional 以及 Frameset
  • XHTML 1.0 規定了三種 XML 文檔類型:分別是StrictTransitional 以及 Frameset
  • Standards (標準)模式(也就是嚴格呈現模式)用於呈現遵循最新標準的網頁;
  • Quirks(包容)模式(也就是鬆散呈現模式或者兼容模式)用於呈現爲傳統瀏覽器而設計的網頁。

22. html5有哪些新特性、移除了那些元素

新特性

HTML5 如今已經不是 SGML 的子集,主要是關於圖像,位置,存儲,多任務等功能的增長。

  • 拖拽釋放(Drag and drop) API
  • 語義化更好的內容標籤(header, nav, footer, aside, article, section);
  • 音頻、視頻API(audio, video);
  • 畫布(Canvas) API;
  • 地理(Geolocation) API;
  • 本地離線存儲 localStorage 長期存儲數據,瀏覽器關閉後數據不丟失;
  • sessionStorage 的數據在瀏覽器關閉後自動刪除;
  • 表單控件:calendardatetimeemailurlsearch ;
  • 新的技術webworker, websocket, Geolocation等;

移除元素

純表現元素

  • <basefont> 默認字體,不設置字體,以此渲染;
  • <font> 字體標籤;
  • <center> 水平居中;
  • <u> 下劃線;
  • <big>字體;
  • <strike>中橫字;
  • <tt>文本等寬;

對可用性產生負面影響的元素

<frameset>,<noframes><frame>

23. Quirks模式是什麼?它和Standards模式有什麼區別?

Quirks模式

Quirks模式,又稱怪癖模式、詭異模式、怪異模式。

Quirks和Standards模式的區別

當咱們在寫程序時,遇到新舊功能不兼容的時候,如何作才能保證原來的接口不變,又能夠提供強大的功能?

通常狀況下能夠經過增長參數和分支來解決。也就是當某個參數爲true時,使用新功能,爲false時使用舊功能,這樣就能不破壞原有的程序,又能提供新功能。

IE6也是相似這樣作的,它將DTD當成了這個「參數」,由於之前的頁面你們都不會去寫DTD,第一IE6就假定,若是寫了DTD就意味這個頁面將採用對CSS支持更好的佈局,而若是沒有就採用兼容以前的佈局方式,這就是Quirks模式(怪癖,詭異,怪異模式)

其與Standards的區別整體會有佈局、樣式解析、和腳本執行三個方面的區別:

  • 盒模型:在W3C標準中,若是設置一個元素的寬度和高度,指的是元素內容的寬度和高度,而在Quirks 模式下,IE的寬度和高度還包含了paddingborder
  • 設置行內元素的高寬:在Standards模式下,給等行內元素設置wdithheight都不會生效,而在quirks模式下,則會生效;
  • 設置百分比的高度:在standards模式下,一個元素的高度是由其包含的內容來決定的,若是父元素沒有設置百分比的高度,子元素設置一個百分比的高度是無效的用;
  • 設置水平居中:使用margin:0 autostandards模式下可使元素水平居中,但在quirks模式下卻會失效。

24. 什麼是前端的結構,樣式和行爲相分離?以及分離的好處是什麼?

結構,樣式和行爲分離

小編的理解是: 如果將前端比做一我的來舉例子,結構(HTML)就至關因而人體的「骨架」,樣式就至關於人體的「裝飾」,例如衣服,首飾等;行爲就至關於人作出的一系列「動做」。

在結構,樣式和行爲分離,就是將三者分離開,各自負責各自的內容,各部分能夠經過引用進行使用。

在分離的基礎上,咱們須要作到代碼的:精簡重用有序

分離的好處

  • 代碼分離,利於團隊的開發和後期的維護;
  • 減小維護成本,提升可讀性和更好的兼容性;

25. 對HTML5有什麼瞭解?

  • 良好的移動性,以移動設備爲主;
  • 響應式設計,以適應自動變化的屏幕尺寸;
  • 支持離線緩存技術,webStorage本地緩存;
  • 新增了canvasvideoaudio等新標籤元素;以及特殊內容元素:articlefooterheadernavsection等;以及表單控件:calendardatetimeemailurlsearch等;
  • 新增webSocket/webWork技術;
  • 還有新增的地理位置等。

26. 如何對網站的文件和資源進行優化

  • 文件合併(目的是減小http請求);
  • 文件壓縮 (目的是直接減小文件下載的體積);
  • 使用緩存;
  • 使用cdn託管資源;
  • gizp壓縮須要的js和css文件;
  • 反向連接,網站外連接優化;
  • meta標籤優化(title, description, keywords),heading標籤的優化,alt優化;

27. Html5中datalist是什麼

<datalist>標籤,用來定義選項列表,與input元素配合使用鈣元素,來定義input可能的值。

datalist及其選項不會被顯示出來,他僅僅是合法的輸入列表值。

<input id="fruits" list="fruit" /><datalist id="fruit">  <option value="apple">  <option value="orange">  <option value="banana"></datalist>
複製代碼

28. Html5中本地存儲概念是什麼,有什麼優勢,與cookie有什麼區別?

HTML5Web storage的存儲方式有兩種:sessionStoragelocalStorage

  • sessionStorage用於本地存儲一個會話中的數據,當會話結束後就會銷燬;
  • sessionStorage不一樣,localStorage用於持久化的本地存儲,除非用戶主動刪除數據,不然數據永遠不會過時;
  • cookie是網站爲了標示用戶身份而儲存在用戶本地終端(Client Side)上的數據(一般通過加密)。

區別

  • 從瀏覽器和服務器間的傳遞看cookie數據始終在同源的http請求中攜帶(即便不須要),即cookie在瀏覽器和服務器間來回傳遞;而sessionStoragelocalStorage不會自動把數據發給服務器,僅在本地保存。
  • 從大小看: 存儲大小限制不一樣,cookie數據不能超過4k,只適合保存很小的數據;而sessionStoragelocalStorage 雖然也有存儲大小的限制,但比cookie大得多,能夠達到5M或更大。
  • 從數據有效期看sessionStorage在會話關閉會馬上關閉,所以持續性不久;cookie只在設置的cookie過時時間以前一直有效,即便窗口或瀏覽器關閉。而localStorage始終有效。
  • 從做用域看sessionStorage不在不一樣的瀏覽器窗口中共享,即便是同一個頁面;而localStoragecookie都是能夠在全部的同源窗口中共享的。

29. 常見的瀏覽器內核有哪些

  • Trident內核:IE最早開發或使用的, 360瀏覽器;
  • Webkit內核:Google Chrome,Safari, 搜狗瀏覽器,360極速瀏覽器, 阿里雲瀏覽器等;
  • Gecko內核: Mozilla FireFox (火狐瀏覽器) ,K-Meleon瀏覽器;
  • Presto內核:Opera瀏覽器;

30. Canvas是什麼?怎樣寫Canvas?

概念

CanvasHTML5的一個元素,它使用JavaScript在網頁上繪製圖形。Canvas是一個矩形區域。它的每個像素均可以由HTML5語言來控制。使用Canvas繪製路徑、框、圓、字符和添加圖像有幾種方法。

使用方式

若是要在咱們的HTML文檔中添加Canvas標籤,咱們須要ID、寬度和高度。下面是如何將基本Canvas標籤寫入HTML文檔的示例。

<canvas id="myCanvas" width="100" height="100"> </canvas>
複製代碼


31. 使用HTML5須要遵照哪些規則

  • 新的特性應該基於HTMLCSSDOMJavaScript,
  • 減小對外部插件的需求(如Flash);
  • 更好的錯誤處理;
  • 更多的替換腳本的標誌;
  • HTML5應與設備無關;
  • 開發過程必須可視化;

32. Html5應用程序緩存和HTML瀏覽器緩存有什麼區別

新的HTML5規範的應用緩存最關鍵的就是支持離線應用,容許瀏覽器在連接客戶端時預取一些或所有網站資產,如HTML文件,圖像,CSS以及JS等,預取文件加速了站點的性能。換句話說,應用程序緩存能夠預取徹底未被訪問的頁面,從而在常規的瀏覽器緩存中不可用。與傳統的瀏覽器緩存比較,該特性並不強制要求用戶訪問網站。

33. 最新的HTML5標準中的API是什麼

  • CanvasCanvasHTML代碼中定義的具備高度和寬度屬性的可繪製區域組成。JavaScript代碼能夠經過一組完整的繪圖函數訪問該區域,這與其餘常見的2D API相似,所以容許動態生成圖形。Canvas 的一些預期用途包括構建圖形、動畫、遊戲和圖像合成。
  • 媒體定時回放;
  • 離線存儲數據庫;
  • 文檔編輯;
  • 拖放;
  • 跨文檔消息傳遞;
  • 瀏覽器歷史管理;
  • MIME類型和協議處理程序註冊;

34. LocalStorage本地存儲在HTML5中有什麼用途

localStorage本地存儲至關於一個輕量級的數據庫,能夠在本地永久的儲存數據(除非人爲刪除)。此外,還能夠在斷網狀況下讀取本地緩存的cookies

  • 使用localStorage保存數據: localStorage.setItem(key, value);
  • 使用localStorage獲取保存的數據: localStorage.getItem(key);
  • 清除localStorage保存的數據: localStorage.removeItem(key);
  • 清除所有localStorage對象保存的數據: localStorage.clear( );

35. 有關HTML5中新的輸入類型屬性

類型 做用
search 用於搜索域 ,域顯示爲常規的文本域
email 用於應該包含email地址的輸入域,在提交表單時,自動驗證email域的值
url 用於應該包含url地址的輸入域在提交表單時,會自動驗證url的域值
number 用於應該包含數值的輸入域,可自定義數字限定
range 用於應該包含必定範圍內數字值的輸入域,類型顯示爲滑動條
dateTime 用於選取時間,日,月,年(爲UTC時間)
date 用於選取日,月,年
month 用於選取月,年
week 用於選取周和年
time 用於選取時間(分鐘和小時)
dateTime-local 用於選取時間,日,月,年(當地時間)

36. 對於web標準以及w3c有何理解與認識

於WEB而言web標準簡單來講能夠分爲結構、表現和行爲。web標準通常是將該三部分獨立分開,使其更具備模塊化。但通常產生行爲時,就會有結構或者表現的變化,也使這三者的界限並不那麼清晰;

於W3C而言W3Cweb標準提出了規範化的要求,也就是在實際編程中的一些代碼規範,以下:

結構上的要求

  • 標籤必須閉合、標籤小寫、不亂嵌套,能夠提升搜索機器人對網頁內容的搜索概率;

對於css和js來講

  • 建議使用外鏈cssjs腳本,從而達到結構與行爲、結構與表現的分離,提升頁面的渲染速度,能更快地顯示頁面的內容;
  • 樣式與標籤的分離,更合理的語義化標籤,使內容能被更多的用戶所訪問、內容能被更普遍的設備所訪問、更少的代碼和組件, 從而下降維護成本、改版更方便;
  • 不須要變更頁面內容,即可提供打印版本而不須要複製內容,提升網站易用性;

總之,遵循w3c制定的web標準,可以使用戶瀏覽者更方便的閱讀,使網頁開發者之間更好的交流。

37. 新的HTML5文檔類型和字符集是什麼

  • HTML5文檔類型:<!doctype html>
  • 字符集:HTML5使用的編碼<meta charset=」UTF-8」>

38. 漸進加強和優雅降級之間的區別

漸進加強(progressive enhancement):主要是針對低版本的瀏覽器進行頁面重構,保證基本的功能狀況下,再針對高級瀏覽器進行效果,交互等方面的改進和追加功能,以達到更好的用戶體驗。

優雅降級 graceful degradation: 一開始就構建完整的功能,而後再針對低版本的瀏覽器進行兼容。

區別

  • 優雅降級是從複雜的現狀開始的,並試圖減小用戶體驗的供給;而漸進加強是從一個很是基礎的,可以起做用的版本開始的,並在此基礎上不斷擴充,以適應將來環境的須要;
  • 降級(功能衰竭)意味着往回看,而漸進加強則意味着往前看,同時保證其根基處於安全地帶。

39. 爲何利用多個域名來存儲網站資源會更有效

  • CDN緩存更加方便;
  • 突破瀏覽器併發限制;
  • 節約cookie寬帶;
  • 節約主域名的鏈接數,優化頁面下響應速度;
  • 防止沒必要要的安全問題;

40. 自身對網頁標準和標準制定機構重要性有何理解

小編我的以爲:網頁標準和標準制定機構是讓web更加規範,更加標準,健康的發展所必不可少的東西。

  • 於開發者而言: 開發者能夠遵循統一的開發標準,大大下降了開發難度,開發成本,從而也提升了代碼的可閱讀性以及易於後期維護;
  • 於SEO而言: 對SEO更加友好,提高了搜索效率。

使用網頁標準和標準制定機構,對於提升網站的易用性起着很是大的做用。


41. 哪些瀏覽器支持HTML5

幾乎全部的高版本瀏覽器Safari,Chrome,Firefox,Opera,IE8以上都支持HTML5

42. 爲何HTML5裏面咱們不須要DTD

HTML5沒有使用SGML或者XHTMLHTML5是一個全新的東西,所以不須要參考DTD,對於HTML5,僅需放置下面的文檔類型代碼告訴瀏覽器識別這是HTML5文檔就行。

43. .瀏覽器如何對HTML5的離線儲存資源進行管理和加載

  • 有線狀況下

(1),瀏覽器發現html頭部有manifest屬性,它會請求manifest文件,若是是第一次訪問app,那麼瀏覽器就會根據 manifest文件的內容下載相應的資源而且進行離線存儲。

(2),若是已經訪問過app而且資源已經離線存儲了,那麼瀏覽器就會使用離線的資源加載頁面,而後 瀏覽器會對比新的manifest文件與舊的manifest文件,若是文件沒有發生改變,就不作任何操做,若是文件改變了,那麼就會從新下載文件中的資源並進行離線存儲。

  • 在離線狀況下: 瀏覽器直接使用離線緩存的資源;

43. 頁面可見性(Page Visibility)API 能夠有哪些用途

在頁面被切換到其餘後臺進程的時候,自動暫停音樂或視頻的播放。

44. HTML5的form如何關閉自動完成功能

給不想要提示的input是設置autocomplete=off便可。

45. HTML中幾種圖片格式的區別以及使用

頁面中經常使用的幾種圖片格式有: png, jpg(jpeg),gif, bmp等;

(1)、Png格式的特徵

特徵: 圖片背景透明,能夠支持的顏色有不少。

使用範圍: 比較廣,在目前使用頻率最高。

(2)、jpg格式特徵

特徵: 圖片不支持透明,靜態圖,支持的顏色也比較多,可壓縮。

使用範圍: 使用範圍較廣,可以使用做爲電腦作面壁紙,手機屏保等,可根據需求來確實使用圖片的分辨率,

(3)、gif格式特徵

特徵: 動態圖,支持的顏色較少。

使用範圍: 在目前看到的在網站內使用頻率較低。

46. 處理兼容問題有兩種方式

  • IE6/IE7/IE8支持經過document方法產生的標籤,利用這一特性讓這些瀏覽器支持HTML5新標籤;
  • 使用是html5shim框架 另外,DOCTYPE聲明的方式是區分HTMLHTML5標誌的一個重要因素,此外,還能夠根據新增的結構,功能元素來加以區分。

寫在最後

以上就是小編此次分享的內容。做爲對於HTML常見面試知識點的統籌,文中部分知識點借(chao)鑑(xi)於度娘。因此,如有小夥伴看到本身的知識點長在上面了,莫慌!!!!獨樂樂不如衆樂樂,知識共享也是一件很快樂的事情呀~

最後,本篇文章會持續更新。此外,若文中有不足的地方,請下方留言指出,小編看到會及時更正。

相關文章
相關標籤/搜索