前端程序員面試筆試通關(guān)寶典

第1章  面試禮儀和技巧  001
1.1  面試前的準(zhǔn)備  001
1.1.1  了解面試企業(yè)的基本情況以及企業(yè)文化  001
1.1.2  了解應(yīng)聘職位的招聘要求以及自身的優(yōu)勢和劣勢  003
1.1.3  簡歷的投遞  003
1.1.4  禮貌答復(fù)面試或筆試通知  004
1.1.5  了解公司的面試流程  004
1.1.6  面試前的心理調(diào)節(jié)  006
1.1.7  儀容儀表  006
1.2  面試中的應(yīng)對技巧  006
1.2.1  自我介紹  007
1.2.2  面試中的基本禮儀  007
1.2.3  如何巧妙地回答面試官的問題  008
1.2.4  如何回答技術(shù)性的問題  009
1.2.5  如何應(yīng)對自己不會的題  009
1.2.6  如何回答非技術(shù)性的問題  010
1.2.7  當(dāng)與面試官對某個問題持有不同觀點(diǎn)時，應(yīng)如何應(yīng)對  010
1.2.8  如何向面試官提問  011
1.2.9  明人“暗語”  011
1.3  面試結(jié)束  012
1.3.1  面試結(jié)束后是否會立即收到回復(fù)  013
1.3.2  面試沒有通過是否可以再次申請  013
1.3.3  怎樣處理錄用與被拒  013
1.3.4  錄用后的薪資談判  014
1.3.5  入職準(zhǔn)備  014
 
第2章  HTML 5  015
2.1  HTML 5基礎(chǔ)  015
2.1.1  基本結(jié)構(gòu)  015
2.1.2  HTML的發(fā)展史  016
2.1.3  HTML 5的優(yōu)勢  017
2.1.4  W3C標(biāo)準(zhǔn)  018
2.2  網(wǎng)頁標(biāo)簽  019
2.2.1  基本標(biāo)簽  019
2.2.2  圖像標(biāo)簽  022
2.2.3  鏈接標(biāo)簽  024
2.3  常用超鏈接  026
2.3.1  頁面間鏈接  026
2.3.2  錨鏈接  026
2.4  行內(nèi)元素和塊級元素  028
2.5  面試與筆試試題解析  031
2.5.1  怎樣區(qū)分HTML 5、HTML和XHTML  031
2.5.2  請闡述你對W3C的理解  032
2.5.3  HTML文檔中的DOCTYPE有什么作用  033
2.5.4  DOCTYPE文檔類型有幾種  033
2.5.5  Quirks模式是什么？它和Standards模式的區(qū)別  033
2.5.6  HTTP狀態(tài)碼  034
2.5.7  什么是IP地址  036
2.5.8  瀏覽器內(nèi)核  036
2.5.9  行內(nèi)元素和塊級元素  037
2.5.10  link和@import  038
2.5.11  HTML 5新特性和瀏覽器兼容  039
2.5.12  如何實(shí)現(xiàn)瀏覽器內(nèi)多個標(biāo)簽頁之間的通信  039
2.5.13  元素的alt和title有什么異同  040
2.5.14  CSS和JavaScript的文件和圖片  040
2.5.15  網(wǎng)頁中的亂碼原因  041
2.5.16  在目標(biāo)窗口中打開超鏈接頁面的兩種方式是什么  041
2.6  名企真題解析  042
2.6.1  JavaScript放在HTML的不同位置有什么區(qū)別  042
2.6.2  HTML 5的離線存儲資源的管理和加載  042
2.6.3  封裝一個isInteger()函數(shù)，用于檢測傳入的值是整數(shù)  042
2.6.4  使用CSS實(shí)現(xiàn)水平垂直居中  043
2.6.5  輸完網(wǎng)址按Enter鍵，在這個過程中發(fā)生了什么  043
 
第3章  列表、表格、媒體元素和表單  044
3.1  列表  044
3.1.1  認(rèn)識列表  044
3.1.2  列表的分類  045
3.2  表格  047
3.2.1  基本語法  047
3.2.2  跨行和跨列  048
3.3  HTML 5的媒體元素  050
3.3.1  視頻元素  050
3.3.2  音頻元素  050
3.4  HTML 5的結(jié)構(gòu)元素  051
3.5  內(nèi)聯(lián)框架  055 3.6  表單  056
3.6.1  表單和表單元素  057
3.6.2  表單校驗(yàn)  060
3.6.3  正則表達(dá)式  061
3.7  面試與筆試試題解析  062
3.7.1  什么是列表以及列表的分類  063
3.7.2  常見的表單元素有哪些  063
3.7.3  表單提交的方式  064
3.7.4  制作下拉列表需要使用哪些表單元素  065
3.7.5  如何在頁面中使用音頻元素和視頻元素  066
3.7.6  定義列表的標(biāo)簽  066
3.7.7  為什么使用HTML 5結(jié)構(gòu)標(biāo)簽來布局網(wǎng)頁  067
3.7.8  使用什么屬性可以達(dá)到表單的初步驗(yàn)證  068
3.7.9  使用JavaScript去除字符串空格  068
3.7.10  在HTML 5中支持哪幾種列表  069
3.7.11  Web前端開發(fā)，如何提高頁面性能優(yōu)化  070
3.7.12  iframe的優(yōu)缺點(diǎn)  070
3.8  名企真題解析  071
3.8.1  JavaScript的垃圾回收機(jī)制  071
3.8.2  如何制作語義化的表單  071
3.8.3  怎樣制作一個調(diào)查問卷  072
3.8.4  如何使用表格制作流量查詢表  073
3.8.5  請說出幾種減少頁面加載時間的方法  074
 
第4章  認(rèn)識 CSS  075
4.1  CSS簡介  075
4.2  CSS的基本語法  076
4.3  HTML中引入CSS樣式  076
4.3.1  行內(nèi)樣式表  076
4.3.2  內(nèi)部樣式表  077
4.3.3  鏈入外部樣式表  078
4.3.4  導(dǎo)入外部樣式表  078
4.4  CSS樣式優(yōu)先級  079
4.5  基本選擇器  079
4.5.1  標(biāo)簽選擇器  079
4.5.2  ID選擇器  080
4.5.3  類選擇器  080
4.6  高級選擇器  081
4.6.1  層次選擇器  081
4.6.2  復(fù)合選擇器  082
4.6.3  屬性選擇器  083
4.7  面試與筆試試題解析  084
4.7.1  什么是CSS  084
4.7.2  CSS優(yōu)先級算法如何計算  085
4.7.3  在HTML中引入CSS樣式的方式是什么  085
4.7.4  CSS 3新特性有哪些  086
4.7.5  為什么要初始化CSS樣式  087
4.7.6  CSS 3新增偽類有哪些  087
4.7.7  如何使用CSS實(shí)現(xiàn)一個三角形  087
4.7.8  瀏覽器怎樣解析CSS選擇器  088
4.7.9  請列舉幾種隱藏元素的方法  089
4.7.10  CSS 3的基本選擇器和語法規(guī)則  089
4.7.11  CSS 3的選擇符有哪些？哪些選擇符可以繼承  089
4.7.12  哪種方式可以對一個DOM設(shè)置其CSS樣式  089
4.7.13  什么是外邊距重疊？重疊的結(jié)果是什么  090
4.8  名企真題解析  090
4.8.1  CSS的文本替換省略號  090
4.8.2  如何使用CSS設(shè)置漸變效果  091
4.8.3  頁面實(shí)現(xiàn)等高布局  092
4.8.4  如何使用CSS設(shè)置背景樣式  093
 
第5章  CSS 3網(wǎng)頁制作和美化  095
5.1  span標(biāo)簽  095
5.2  文本樣式  096
5.3  超鏈接偽類  100
5.4  使用CSS設(shè)置超鏈接  102
5.4.1  列表樣式  102
5.4.2  背景樣式  103
5.5  CSS 3漸變  104
5.5.1  CSS 3漸變兼容  104
5.5.2  線性漸變  105
5.6  CSS 3屬性制作動畫  105
5.6.1  CSS 3變形  106
5.6.2  CSS 3過渡  107
5.6.3  CSS 3動畫  110
5.7  面試與筆試試題解析  112
5.7.1  font屬性設(shè)置  112
5.7.2  在CSS中設(shè)置文本行高使用哪些屬性  112
5.7.3  全屏滾動的原理以及用到的CSS屬性  113
5.7.4  CSS優(yōu)化、提高性能的方法有哪些  114
5.7.5  CSS 3的flexbox（彈性盒布局模型）  114
5.7.6  簡單介紹什么是REST  115
5.7.7  使用CSS 3過渡有哪些觸發(fā)方式  115
5.7.8  圖片格式png、jpg和gif的使用  116
5.7.9  簡單闡述圖像的預(yù)加載和懶加載  116
5.7.10  字號使用奇數(shù)還是偶數(shù)  117
5.7.11  undefined和null有哪些異同  117
5.7.12  first-child和first-of-type有什么區(qū)別  118
5.7.13  CSS中類選擇器和ID選擇器有哪些區(qū)別  118
5.7.14  CSS偽類與CSS偽對象的區(qū)別  118
5.7.15  position的absolute與fixed的共同點(diǎn)與不同點(diǎn)  118
5.8  名企真題解析  119
5.8.1  如何制作百度音樂標(biāo)簽頁面  119
5.8.2  如何制作新聞資訊頁  119
5.8.3  display:none與visibility:hidden的區(qū)別  121
5.8.4  如何制作家用電器商品分類頁面  122
5.8.5  暢銷書排行榜頁面怎樣實(shí)現(xiàn)  123
5.8.6  margin和padding分別適合什么場景使用  124
 
第6章  盒子模式和浮動  125
6.1  盒子模型  125
6.1.1  盒子模型的組成  125
6.1.2  盒子模型的特征  127
6.2  盒子陰影  128
6.3  display屬性  128
6.4  浮動  129
6.5  盒子模型的定位  130
6.6  溢出處理  131
6.7  inline-block和float的共性和區(qū)別  131
6.8  面試與筆試試題解析  132
6.8.1  position的定位屬性有哪些  132
6.8.2  什么叫Web安全色  133
6.8.3  如何清除一個網(wǎng)頁元素的浮動  134
6.8.4  前端為什么提倡模塊化開發(fā)  134
6.8.5  去掉網(wǎng)頁中超鏈接的藍(lán)色邊框  136
6.8.6  請說說你對元素浮動float的理解  137
6.8.7  CSS中的@font-face有什么作用  138
6.8.8  定位absolute和浮動float有哪些區(qū)別  138
6.8.9  有幾種方法可以解決父級邊框塌陷  139
6.8.10  CSS的盒子模型有哪些以及它們的區(qū)別  141
6.9  名企真題解析  141
6.9.1  如何實(shí)現(xiàn)一個圣杯布局  141
6.9.2  標(biāo)準(zhǔn)盒子模型和IE盒子模型的區(qū)別  144
6.9.3  如何判斷哪一年是閏年  145
6.9.4  編寫一個函數(shù)，用于清除字符串前后的空格  145
6.9.5  用伸縮盒子實(shí)現(xiàn)子元素的水平和垂直居中  147
 
第7章  定位網(wǎng)頁元素  150
7.1  定位  150
7.1.1  元素的定位屬性  150
7.1.2  靜態(tài)定位  151
7.1.3  相對定位  151
7.1.4  定位  151
7.1.5  固定定位  152
7.2  z-index屬性  153
7.2.1  z-index基礎(chǔ)  154
7.2.2  層疊上下文和層疊層  154
7.2.3  層疊次序  154
7.2.4  層級關(guān)系的比較  155
7.2.5  z-index規(guī)則  155
7.3  網(wǎng)頁元素透明度  156
7.4  面試與筆試試題解析  157
7.4.1  不同的定位方式有什么特性  157
7.4.2  什么是CSS Sprite  158
7.4.3  什么是設(shè)備像素比  158
7.4.4  全局函數(shù)eval()有什么作用  159
7.4.5  HTML中a標(biāo)簽的幾大作用  160
7.4.6  什么是錨點(diǎn)  162
7.4.7  z-index的用法  162
7.4.8  什么是分區(qū)響應(yīng)圖  163
7.4.9  在網(wǎng)頁中z-index對沒有設(shè)置定位的網(wǎng)頁元素是否有效  163
7.4.10  設(shè)置為relative對象的z-index屬性需要遵循什么規(guī)則  164
7.4.11  怎么比較z-index的優(yōu)先級  164
7.4.12  一個DOM元素綁定多個事件時，先執(zhí)行冒泡還是捕獲  165
7.4.13  元素位置重疊的可能原因  165
7.4.14  div元素的層疊次序  166
7.4.15  IE怎么設(shè)置頁面的透明度  167
7.4.16  怎么解決div相互層疊覆蓋問題  168
7.4.17  哪些方式可以創(chuàng)建層疊上下文  168
7.5  名企真題解析  169
7.5.1  在CSS中使用什么方式可以設(shè)置網(wǎng)頁元素的透明度  169
7.5.2  請列舉幾個HTML 5新增的圖像相關(guān)的語義化元素  170
7.5.3  如何獲得頁面上元素的背景色  170
7.5.4  如何設(shè)計一個浮動中的元素水平居中  171
7.5.5  JavaScript尋找當(dāng)前頁面中的z-index值的方法  171
 
第8章  腳本語言  174
8.1  JavaScript  174
8.1.1  組成結(jié)構(gòu)  174
8.1.2  核心語法  175
8.1.3  函數(shù)定義和調(diào)用  177
8.1.4  JavaScript操作BOM對象  177
8.1.5  JavaScript操作DOM對象  178
8.2  jQuery  180
8.2.1  jQuery工作原理  180
8.2.2  事件與動畫  181
8.2.3  使用jQuery操作DOM  183
8.2.4  jQuery HTML  184
8.3  面試與筆試試題解析  185
8.3.1  在HTML頁面中如何引用JavaScript  185
8.3.2  如何實(shí)現(xiàn)DOM對象和jQuery對象間的轉(zhuǎn)化  186
8.3.3  如何按層次關(guān)系訪問節(jié)點(diǎn)  186
8.3.4  列出實(shí)現(xiàn)不同模塊之間通信的方式  188
8.3.5  如何使用jQuery實(shí)現(xiàn)隔行變色的效果  188
8.3.6  原生JavaScript獲取節(jié)點(diǎn)的方法  189
8.3.7  如何改變?yōu)g覽器地址欄中的網(wǎng)址  190
8.3.8  jQuery操作select下拉框的多種方法  190
8.3.9  如何用jQuery來創(chuàng)建插件  191
8.3.10  在jQuery中使用什么方法可控制元素的淡入和淡出  192
8.3.11  jQuery中.css()與.addClass()設(shè)置樣式的區(qū)別  193
8.3.12  JavaScript訪問HTML元素的幾種方式  194
8.3.13  簡述JavaScript中的12種DOM節(jié)點(diǎn)類型  194
8.3.14  controller as和controller有什么區(qū)別，能解決什么問題?  196
8.3.15  請指出JavaScript宿主對象和原生對象的區(qū)別  196
8.3.16  請解釋JavaScript中this是如何工作的  197
8.3.17  請解釋JSONP的工作原理  197
8.4  名企真題解析  198
8.4.1  何如使用JavaScript實(shí)現(xiàn)冒泡排序  198
8.4.2  如何取消$timeout以及停止一個$watch()  199
8.4.3  在網(wǎng)頁中實(shí)現(xiàn)一個倒計時，能夠動態(tài)顯示“某天某時某分某秒”  199
8.4.4  在jQuery中顯示和隱藏HTML元素的方法分別是什么  200
 
第9章  前端流行框架  202
9.1  Vue.js  202
9.1.1  Vue.js簡介  202
9.1.2  基礎(chǔ)語法  202
9.1.3  屬性綁定  204
9.1.4  事件處理器  205
9.1.5  Vue.js組件  206
9.2  Angular JS  207
9.2.1  Angular JS表達(dá)式  207
9.2.2  Angular JS指令  207
9.2.3  Angular JS Scope  209
9.2.4  事件、模塊和表單  210
9.3  面試與筆試試題解析  211
9.3.1  Angular JS的雙向數(shù)據(jù)綁定原理是什么  211
9.3.2  如何優(yōu)化臟檢查與運(yùn)行效率  211
9.3.3  談?wù)勀銓ue.js是一套漸進(jìn)式框架的理解  212
9.3.4  在Vue.js中組件之間的傳值如何實(shí)現(xiàn)  213
9.3.5  v-if和v-show有什么區(qū)別  213
9.3.6  什么是$rootScrope以及和$scope有什么區(qū)別  214
9.3.7  如何在頁面上實(shí)現(xiàn)前進(jìn)、后退  214
9.3.8  什么是Vue的計算屬性  215
9.3.9  在Angular中是否可以使用jQuery  216
9.3.10  請簡述$compile的用法  216
9.4  名企真題解析  217
9.4.1  Vue項(xiàng)目的搭建步驟  217
9.4.2  vue-router有哪幾種導(dǎo)航鉤子（導(dǎo)航守衛(wèi)）  217
9.4.3  請寫出完整的vue-router導(dǎo)航解析流程  219
 
第10章  BootStrap  221
10.1  響應(yīng)式布局  221
10.2  BootStrap樣式  222
10.3  BootStrap組件  224
10.4  JavaScript插件  227
10.5  精選面試與筆試題解析  228
10.5.1  簡單描述BootStrap的整體架構(gòu)  228
10.5.2  什么是BootStrap柵格系統(tǒng)，為什么要使用BootStrap  229
10.5.3  使用BootStrap的基本HTML模板必需要引入什么文件  230
10.5.4  寫出基本下拉菜單組件的結(jié)構(gòu)  231
10.5.5  BootStrap有哪些插件，分別是什么  231
10.5.6  動畫過渡插件應(yīng)用在其他的哪些插件中  232
10.5.7  如何設(shè)置模態(tài)框尺寸大  233
10.5.8  BootStrap常用的組件有哪些  233
10.5.9  旋轉(zhuǎn)輪播有哪些方法  234
10.5.10  BootStrap導(dǎo)航欄中有哪些功能  234
10.5.11  布局有幾種方式  236
10.5.12  Flex布局有哪幾種屬性  237
10.5.13  媒體查詢有哪些屬性  238
10.5.14  響應(yīng)式布局的優(yōu)點(diǎn)和缺點(diǎn)是什么  239
10.5.15  HTML中適合做按鈕的元素是什么  240
10.5.16  寫出BootStrap中基礎(chǔ)的表單結(jié)構(gòu)  240
10.5.17  BootStrap有什么特點(diǎn)  241
10.5.18  組件、控件和插件的區(qū)別  242
10.5.19  BootStrap網(wǎng)格系統(tǒng)的實(shí)現(xiàn)原理  242
10.6  名企真題解析  243
10.6.1  BootStrap表格有哪些可選樣式  243
10.6.2  如果網(wǎng)頁內(nèi)容需要支持多語言，應(yīng)該怎么做  244
10.6.3  BootStrap中Class怎么命名  245
 
第11章  Web頁面開發(fā)  246
11.1  移動Web頁面開發(fā)  246
11.1.1  移動開發(fā)測試瀏覽器  246
11.1.2  移動端視口及視口標(biāo)簽  247
11.1.3  移動端網(wǎng)頁開發(fā)  248
11.1.4  設(shè)備像素比  249
11.2  移動Web特效開發(fā)  249
11.2.1  移動端事件  249
11.2.2  zepto框架  251
11.3  面試與筆試試題解析  252
11.3.1  相對單位rem的特性是什么  252
11.3.2  移動網(wǎng)頁開發(fā)與計算機(jī)網(wǎng)頁開發(fā)有什么區(qū)別  252
11.3.3  移動開發(fā)測試瀏覽器有什么差異  253
11.3.4  移動端視口有哪些  254
11.3.5  px、em和rem有什么區(qū)別  255
11.3.6  實(shí)現(xiàn)Web App屏幕適配的方法有哪些  256
11.3.7  寫出CSS 3變形、過渡、動畫的語法和采用的屬性  257
11.3.8  簡述jQuery與zepto的異同  258
11.3.9  zepto的點(diǎn)透問題如何解決  259
11.3.10  理想視口是什么，怎么實(shí)現(xiàn)理想視口  260
11.3.11  什么叫優(yōu)雅降級和漸進(jìn)增強(qiáng)  260
11.3.12  怎么解決移動端300ms點(diǎn)擊延遲  261
11.3.13  固定定位布局時鍵盤擋住輸入框內(nèi)容怎么解決  262
11.3.14  怎么判斷是否橫屏  263
11.3.15  移動端用過哪些meta標(biāo)簽  263
11.3.16  移動端開發(fā)的兼容問題  266
11.3.17  頁面優(yōu)化有哪些方法  266
11.3.18  移動端手勢操作有哪些，怎么實(shí)現(xiàn)  269
11.4  名企真題解析  271
11.4.1  移動觸摸端怎么應(yīng)用幻燈片  271
11.4.2  計算機(jī)端與移動端在UI設(shè)計方面有什么區(qū)別  272
11.4.3  視差滾動實(shí)現(xiàn)原理是什么  273