1.HTML5中的DataList是什么？
<datalist>定義選項列表，與input元素配合使用，來定義input可能的值。datalist及其選項不會被顯示出來，他僅僅是合法的輸入值列表
2.SVG是什么?
svg（Scalable Vector Graphics,可伸縮矢量圖形）由萬維網聯盟（W3C）推出的基於xxxxim編碼的開放式圖形、圖像標准。他雖然是一種二維矢量圖形格式，但其中包含矢量圖形、光柵圖像及文本等。
3.HTML5canvas是什么?
定義圖形，比如圖表和其他圖像
4.如何使用canvas來畫一條線?
- <canvas id="canvas" style="border:1px solid #aaa;display: block;margin:50px auto;">"></canvas>
- <script>
- window.onload= function() {
- var canvas = document.getElementById('canvas')
- var context = canvas.getContext('2d')
- canvas.width = 1024
- canvas.height = 768
- context.moveTo(100,100)
- context.lineTo(700,700)
- context.lineWidth = 5
- context.strokeStyle = 'red'
- context.stroke()
- }
- </script>
5.HTML5中如何實現應用緩存?
- <!DOCTYPE html>
- <!--如需啟動應用程序緩存，請在文檔<html>標簽中包含manifest屬性-->
- <html lang="en" manifest="demo.appcache">
- <head>
- <meta charset="UTF-8">
- <title>HTML應用緩存的實現</title>
- </head>
- <body>
- 文檔內容。。。。
- </body>
- </html>
- <!--CACHE MANIFEST - 在此標題下列出的文件將在首次下載后進行緩存-->
- <!--NETWORK - 在此標題下列出的文件需要與服務器的連接，且不會被緩存-->
- <!--FALLBACK - 在此標題下列出的文件規定當頁面無法訪問時的回退頁面（比如 404 頁面）-->
- <!--完整Mainfest文件-->
- CACHE MANIFEST
- # 2012-02-21 v1.0.0
- /theme.css
- /logo.gif
- /main.js
- NETWORK:
- login.php
- FALLBACK:
- /html/ /offline.html
6.本地存儲和cookie(存儲在用戶本地終端上的數據)之間的區別是什么?
cookie數據始終在同源http請求中攜帶（即使不需要），即cookie在瀏覽器和服務器間來回傳遞；cookie數據還有路徑的概念，可以限制cookie只屬於某個路徑下。存儲大小限制不同，cookie數據不能超過4k，同時因為每次http請求都會攜帶cookie，所以cookie只適合保存很小的數據，如回話標識。數據有效期不同，cookie只在設置的cookie過期時間之前一直有效，即使窗口或瀏覽器關閉。
7.HTML5為什么只需要寫<!DOCTYPEHTML>?
HTML5不基於SGML，因此不需要對DTD進行引用，但是需要doctype來規范瀏覽器行為（讓瀏覽器按照他們應該的方式來運行）而HTML4基於SGML，所以需要對DTD進行引用，才能告知瀏覽器文檔所使用的文檔類型
8.行內元素有哪些?塊級元素有哪些? 空(void)元素有哪些?
行內元素：a b span img select strong 塊級元素：div ul ol li dl dt h1 p 空元素： <br> <hr> <img> <link> <meta>
9.頁面導入樣式時,使用link和@import有什么區別?
1.link屬於XHTML標簽，而@import完全是css提供的一種方式。link標簽除了可以加載css外，還可以做很多其他的事情。比如定義RSS，定義rel屬性等， 而@import就只能加載css了。
2.加載順序的區別。當一個頁面被加載的時候，link引用的css會同時被加載，而@import引用的css會等到頁面全部被下載完再被加載。
3.兼容性的差別。由於@import是css2.1提出的，所以老的瀏覽器不支持，@import只有在IE5以上的瀏覽器才能是識別，而link標簽無此問題。
4.使用dom控制樣式的差別。當使用javascript控制dom去改變樣式的時候，只能使用link標簽因為@import不是dom可以控制的。
10.HTML5有哪些特性、移除了哪些元素？如何處理HTML5新標簽的瀏覽器兼容性？
主要是關於圖像，位置，存儲，多任務等功能的增加。
語義化更好的標簽：header , nav , footer , aside , article , section
音頻，視頻： audio video
畫布：canvas
本地離線存儲localstorage長期存儲數據，瀏覽器關閉后數據不丟失，sessionStorage的數據在瀏覽器關閉后自動刪除
表單控件：calendar、date、time、email、url、search
新的技術：webworker，websock，Geolacation
移除的元素：basefont，big，center，font，s，frame等
兼容性處理：IE8/IE7/IE6支持通過document.createElement方法產生的標簽，可以利用這一特性讓這些瀏覽器支持HTML5標簽，瀏覽器支持新標簽后，還需要添加標簽默認樣式。當然最后的方式是直接利用成熟的框架，使用最多的是html5shim框架
- <strong><!--[if lt IE 9]> </strong>
- <script> src="http://html5shim.googlecode.com/svn/trunk/html5.js"</script>
- <![endif]-->
11.如何區分HTML和HTML5？
1.在文檔類型聲明上
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>
2、在結構語義上
HTML:沒有體現結構語義化的標簽，通常都是這樣來命名的<div id="header"></div>，這樣表示網站的頭部。
HTML5:在語義上卻有很大的優勢，提供了一些新的HTML5標簽比如: article、footer、header、nav、section，這些通俗易懂。
12.HTML5的離線存儲怎么使用，工作原理能不能解釋一下？
在用戶沒有因特網鏈接時，可以正常訪問站點或應用，在用戶與因特網連接時，更新用戶機器上的緩存文件.
原理：HTML5的離線儲存是基於一個新建的 .appcache文件的緩存機制（不是緩存技術），通過這個文件上的解析清單離線存儲資源，這些資源就會像cookie一樣被存儲下來。之后網絡在處於離線狀態下時，瀏覽器會通過被離線存儲的數據進行頁面展示。
如何使用：
1、頁面頭部像下面一樣加入一個manifest的屬性；
2、在cache.manifest文件的編寫離線存儲的資源；
CACHE MANIFEST
#v0.11
CACHE:
js/app.js
css/style.css
NETWORK:
resourse/logo.png
FALLBACK:
/ /offline.html
3、在離線狀態時，操作window.applicationCache進行需求實現。
13.HTML5常見的兼容性問題？
1.讓老式瀏覽器支持HTML5
2.讓老式瀏覽器兼容css3
14.簡述css的盒子模型？
css盒子模型，又稱框模型，包含了元素內容（content）、內邊距（padding）、邊框（border）、外邊距（margin）幾個元素。
16.css選擇符有哪些？哪些屬性可以繼承？優先級算法如何計算？css3有哪些新屬性？
css選擇符：
-
-
- id選擇器（#myid）
- 類選擇器（.myclassname）
- 標簽選擇器（div，h1, p）
- 相鄰選擇器（h1 + p）
- 子選擇器（ul > li）
- 后代選擇器（li a）
- 通配符選擇器（*）
- 屬性選擇器(a[rel = 'external'])
- 偽類選擇器（a:hover，li：nth-child）
-
可繼承屬性：
- font-size
- font-family
- color
- text-indent
優先級算法：
- 優先級就近原則，同權重情況下樣式定義最近者為准；
- 載入樣式以最后載入的定位為准
- ！import > id > class > tag
- important 比內聯優先級搞，但內聯比id要高
17.如何居中div？如何居中一個浮動元素？
18.dispaly:inline-block 什么時候會顯示間隙？
真正意義的inline-block水平呈現的元素間，換行顯示或者空格分隔的情況下會有間隙
19.簡述一下 src 和 href 的區別？
scr用於替換當前元素，href用於在當前文檔和引用資源之間確立關系。
src是source的縮寫，指向外部資源的位置，指向的內容將會嵌入到文檔中當前標簽所在的位置；在請求src資源時會將其指向的資源下載並應用到文檔內，列如js腳本，img圖片，和iframe等元素。當瀏覽器解析到該元素時，會暫停其他資源的加載，直到將該資源加載、編譯、執行完畢，圖片和框架等元素也如此，類似將所指向資源嵌入當前標簽內。
href是Hypetext Reference的縮寫，指向網絡資源所在的位置，建立和當前元素（錨點）或當前文檔（鏈接）之間鏈接，
如果我們在文檔中添加
<link href="common.css" rel="stylesheet"/>
那么瀏覽器會識別該文檔為css文件，就會並行下載資源並且不會停止對當前文檔的處理。這也是為什么建議使用link方式來加載css，而不是使用@import方式。
20.瀏覽器的內核分別是什么？
1.Trident內核：代表作品是IE
2.Gecko內核：代表作品Firefox
3.Webkit內核：代表作品是Safari
4.prosto內核：Opera
5.Blink內核：chrome
21.請給出異步加載js方案，不少於兩種方案。
1.defer，只支持IE
2.async
3. 創建script，插入到DOM中，加載完畢后callBack
22.請寫出jquery綁定事件的方法，不少於兩種
1.bind
2.delegate
3.live
4.on
23.ajax是什么？
是一種用於創建快速動態網頁技術，無需重新加載整個網頁的情況下，能夠更新部分網頁的技術。
24.同一個頁面中，能否加載多個document.ready事件？
可以
25.如何實現瀏覽器內多個標簽之間通信？
1.使用localStorage
2.使用cookie+setInterval
26.http響應中content-type包含哪些內容？
定義網絡文件的類型和網頁的編碼，決定瀏覽器將以什么形式、什么編碼讀取這個文件
27.一個ajax建立的過程是怎么樣的，主要用到哪些狀態碼？
常用狀態碼（status）及其含義：
404 沒找到頁面(not found)
403 禁止訪問(forbidden)
500 內部服務器出錯(internal service error)
200 一切正常(ok)
304 沒有被修改(not modified)(服務器返回304狀態，表示源文件沒有被修改 )
28.簡單介紹一下promise，它解決了什么問題？
29.簡述XSS和CSRF攻擊