[TOC]
### 1. html5新特性，對它的了解
更多的是一種規范：
* 新特性應該基于 HTML、CSS、DOM 以及 JavaScript。
* 減少對外部插件的需求（比如 Flash）
* 更優秀的錯誤處理
* 更多取代腳本的標記
* HTML5 應該獨立于設備
* 開發進程應對公眾透明
新特性包含的有：
* 用于繪畫的 canvas 元素
* 用于媒介回放的 video 和 audio 元素
* 對本地離線存儲的更好的支持
* 新的特殊內容元素，比如 article、footer、header、nav、section
* 新的表單控件，比如 calendar、date、time、email、url、search
### 2. 前端頁面有哪三層分別是什么（HTML css JavaScript 結構 修飾 控制）
**最準確的網頁設計思路是把網頁分成三個層次，即：結構層、表示層、行為層。**
**網頁的結構層**（structural layer）由 HTML 或 XHTML 之類的標記語言負責創建。標簽，也就是那些出現在尖括號里的單詞，對網頁內容的語義含義做出了描述，但這些標簽不包含任何關于如何顯示有關內容的信息。例如，P 標簽表達了這樣一種語義：“這是一個文本段。”
**網頁的表示層**（presentation layer） 由 CSS 負責創建。 CSS 對“如何顯示有關內容”的問題做出了回答。
**網頁的行為層**（behavior layer）負責回答“內容應該如何對事件做出反應”這一問題。這是 Javascript 語言和 DOM 主宰的領域。
網頁的表示層和行為層總是存在的，即使我們未明確地給出任何具體的指令也是如此。此時， Web 瀏覽器將把它的默認樣式和默認事件處理函數施加在網頁的結構層上。例如，瀏覽器會在呈現“文本段”元素時留出頁邊距，有些瀏覽器會在用戶把鼠標指針懸停在 某個元素的上方時彈出一個顯示著該元素的 title 屬性值的提示框，等等。
### 3.對web標準及w3c規范的了解和認識
~~~
W3C對web標準提出了規范化的要求，也就是在實際編程中的一些代碼規范
1.對于結構要求：（標簽規范可以提高搜索引擎對頁面的抓取效率，對SEO很有幫助）
1）。標簽字母要小寫
2）。標簽要閉合
3）。標簽不允許隨意嵌套
2.對于css和js來說
1）。盡量使用外鏈css樣式表和js腳本。是結構、表現和行為分為三塊，符合規范。同時提高頁面渲染速度，提高用戶的體驗。
2）。樣式盡量少用行間樣式表，使結構與表現分離，標簽的id和class等屬性命名要做到見文知義，標簽越少，加載越快，用戶體驗提高，代碼維護簡單，便于改版
3）。不需要變動頁面內容，便可提供打印版本而不需要復制內容，提高網站易用性。
~~~
### 4.什么是路由，vue如何實現路由
~~~
1. 路由是根據url的不同顯示不同的頁面
~~~
#### 1.事件路由
~~~
<button @click="handleClick">跳轉到首頁</button>
~~~
~~~
methods:{
handleClick(){
this.$router.push('/')
}
}
~~~
#### 2.router-link路由
~~~
<router-link to="/"></router-link>
~~~
### 5. 談談document.ready和window.onload的區別
[詳解](http://www.hmoore.net/tjs5945111/jquery/787372)
### 6. 你認為高質量的代碼具備哪些特點
~~~
模塊化 低耦合 高復用 可維護 可擴展
~~~
### 7. 寫一段代碼監聽該按鈕的點擊事件
~~~
var btn = document.getElementsByTagName('button');
btn[0].addEventListener('click', function() {
alert('你點擊了這個按鈕');
}, false);
~~~
~~~
var dd = document.getElementById('id')
dd .removeEventListener('click',function(){
alert('移除事件監聽')
});
~~~
### 8. form表單中的action
~~~
action 屬性規定當提交表單時，向何處發送表單數據。
~~~
### 9. cooking和session
~~~
1.都是用來存放用戶信息的
2. 區別：
① Cookie存放在客戶端；Session存放在服務器端；
② Cookie內存小，Session內存大
~~~
### 10. js如何擴展prototype？
~~~
/**
* 創建一個weekday()函數，把它添加到Date對象的原型中去，
* 返回一個字符串，表明當前日期對象是星期幾
*/
Date.prototype.weekday=function(){
var day=this.getDay();
var arr=["星期日","星期一","星期二","星期三","星期四","星期五","星期六"];
return arr[day];
};
~~~
### 11.import和link區別
（1）從屬關系區別：
~~~
link屬于XHTML標簽，除了加載CSS外，還能用于定義RSS，定義rel連接屬性等作用；
@import是CSS提供的，用于引入外部文件
~~~
（2）加載順序區別：
~~~
link標簽引入的CSS被同時加載，@import引入的CSS將在頁面在在完畢后被加載（耗時）。
~~~
（3）DOM可控性區別：
~~~
可通過JS操作DOM插入link標簽改變樣式，無法使用@import的方式插入樣式。
~~~
### 12. 前端開發性能優化
~~~
1. 壓縮css、js文件
2. 合并js、css文件，減少http請求
3. 外部js、css文件放在最底下
4. 減少dom操作，盡可能用變量替代不必要的dom操作
~~~
### 13. js定時器
[詳解](http://www.runoob.com/w3cnote/js-timer.html)
js 定時器有以下兩個方法：
* setInterval() ：按照指定的周期（以毫秒計）來調用函數或計算表達式。方法會不停地調用函數，直到 clearInterval() 被調用或窗口被關閉。
* setTimeout() ：在指定的毫秒數后調用函數或計算表達式。
### 14. document.wriite和innhtml區別
~~~
主要區別：document.write是直接將內容寫入頁面的內容流，會導致頁面全部重繪，innerHTML將內容寫入某個DOM節點，不會導致頁面全部重繪
~~~
### 15. 對瀏覽器內核的理解、有哪些內核
~~~
主要分成兩個部分：渲染引擎(Render Engine)和JS引擎。
~~~
1.渲染引擎：
負責取得網頁的內容（HTML、XML、圖像等等）、整理訊息（例如加入CSS等），以及計算網頁的顯示方式，然后會輸出至顯示器或打印機。
瀏覽器的內核的不同對于網頁的語法解釋會有不同，所以渲染的效果也不相同。所有網頁瀏覽器、電子郵件客戶端以及其它需要編輯、顯示網絡內容的應用程序都需要內核。
2.JS引擎則：
解析和執行javascript來實現網頁的動態效果。
> 最開始渲染引擎和JS引擎并沒有區分的很明確，后來JS引擎越來越獨立，內核就傾向于只指渲染引擎。
3. 種類
- (1)Trident內核
- (2)Gecko內核
- (3)WebKit內核
- (4)Blink內核
### 16. es6新特性
~~~
1. 使用let申明變量有塊級作用域，不能重復聲明，沒有申明提前
2. 箭頭函數，更加簡潔并且解決了this的指向問題
3. 解構語法和展開語法默認賦值
4. 類和繼承
5. promise ,axios和ajax就是一個promise（定義兩個變量用來接收發送的ajax請求 通過promise all觸發 通過這個例子可以用來說明 ajax是一個promise）
~~~
### 17.回調函數(在ajax中可以實現代碼分離)
~~~
// 回調函數可以將函數內部的值返回到外部使用，剝奪了函數return的能力(函數傳參可以傳函數)
var go=function(back){
var a=1;
back:test(a)
}
function test(a){
console.log(a)
//1
}
go(test)
~~~
### 18.使用[transform](https://www.cnblogs.com/shenfangfang/p/5714687.html)時使用哪個屬性改變中心點
~~~
transform-origin:?center bottom
~~~
