需要更多的面試題點(diǎn)擊下面鏈接查看，有很多：

web前端全棧資料粉絲福利（面試題、視頻、資料筆記、進(jìn)階路線）

另外這是小編做的視頻希望可以幫助到你：

『HTML+CSS』漂亮小姐姐教你制作暗黑破壞神網(wǎng)頁開發(fā)：BV1C54y1X7ro

前端發(fā)展簡(jiǎn)史，功能以及未來趨勢(shì)?。阒档糜^看）：BV1w5411s7e4

給想學(xué)編程又無從下手的小白一些建議：BV1Zf4y117ji

「HTML+CSS」實(shí)現(xiàn)妙筆千山播放器制作（思路講解＋代碼+成品效果）！：BV18p4y1Q7Y1

前端面試，跳槽必刷200+真面試題，讓你披荊斬棘走進(jìn)大廠：BV1bz4y1d7Ys

十年前端：為你講解前端之路：BV1L541147hW

人美聲甜的小姐姐教你用HTML實(shí)現(xiàn)B站滾動(dòng)條導(dǎo)航哦?。?a target="_blank">BV1Bk4y1k7XF

前端小白們?nèi)嗣缆曁鸬男〗憬憬棠闳绾沃谱骼寺幕鸹◥坌?20表白成功：BV1tf4y1U7sZ

1 在jquery 中想要找到所有元素的同輩元素，下面哪一個(gè)是可以實(shí)現(xiàn)的？

A、eq(index)

B、find(expr)

C、siblings([expr])

D、next()

參考答案：C

答案解析：

jQuery siblings() 方法----------------------siblings() 方法返回被選元素的所有同胞元素。下面的例子返回的所有同胞元素：### 實(shí)例$(document).ready(function(){$("h2").siblings();});

您也可以使用可選參數(shù)來過濾對(duì)同胞元素的搜索。下面的例子返回屬于的同胞元素的所有元素：實(shí)例

$(document).ready(function(){

$("h2").siblings("p");

});

jQuery next() 方法------------------next() 方法返回被選元素的下一個(gè)同胞元素。該方法只返回一個(gè)元素。下面的例子返回的下一個(gè)同胞元素：### 實(shí)例

$(document).ready(function(){

$("h2").next();

});

jQuery find() 方法find() 方法返回被選元素的后代元素，一路向下直到最后一個(gè)后代。

下面的例子返回屬于后代的所有元素：### 實(shí)例

$(document).ready(function(){

$("div").find("span");

});

2.以下不是RDBMS 的是()

A、mysql

B、postgreSql

C、oracle

D、hadoop

參考答案：D

答案解析：RDBMS 是SQL 的基礎(chǔ)，同樣也是所有現(xiàn)代數(shù)據(jù)庫(kù)系統(tǒng)的基礎(chǔ)，比如MS SQL Server, IBM DB2, Oracle,MySQL 以及Microsoft Access。hadoop 是分布式數(shù)據(jù)庫(kù)

3.JavaScript 的基本組成不包括以下()選項(xiàng)

A、DOM

B、BOM

C、ECMAScript

D、jQuery參考答案：D

答案解析：jQuery 是javascript 寫的類庫(kù)。JavaScript 的三個(gè)主要組成部分是：ECMAScript(核心)，DOM（文檔對(duì)象模型），BOM（瀏覽器對(duì)象模型）。

4.對(duì)于border-radius 標(biāo)簽，說法錯(cuò)誤的是對(duì)于border-radius，說法錯(cuò)誤的是

A、表示圓角邊框

B、IE8 支持良好

C、IE9 支持良好

D、firefox 支持良好

參考答案：B

答案解析：Internet Explorer 9+ 支持border-radius 和box-shadow 屬性。Firefox 、Chrome 以及Safari 支持所有新的邊框?qū)傩?。注釋：?duì)于border-image ，Safari 5 以及更老的版本需要前綴-webkit- 。Opera 支持border-radius 和box-shadow 屬性，但是對(duì)于border-image 需要前綴-o-![]5.在做移動(dòng)開發(fā)的時(shí)候，頁面上顯示了一個(gè)數(shù)據(jù)列表，要求在頁面的左側(cè)顯示數(shù)據(jù)的標(biāo)...在做移動(dòng)開發(fā)的時(shí)候，頁面上顯示了一個(gè)數(shù)據(jù)列表，要求在頁面的左側(cè)顯示數(shù)據(jù)的標(biāo)題，右側(cè)顯示一張導(dǎo)航圖標(biāo)，該怎么來做（）

A、<div style="float:left">文本標(biāo)題</div> <divstyle="float:right">圖標(biāo)</div>

B、<div>文本標(biāo)題</div> <div>圖標(biāo)</div>

C、<div style="display:box;">文本標(biāo)題</div> <divstyle="display:box">圖標(biāo)</div>

D、<div style="float:left">文本標(biāo)題</div> <divstyle="float:left">圖標(biāo)</div>

參考答案：A

6.關(guān)于JQuery 的屬性操作方法，下面描述錯(cuò)誤的是：（）

A、addClass( ) ：向匹配的元素添加指定的類名

B、val( )：設(shè)置或返回匹配元素的值

C、html( ): 設(shè)置或返回匹配的元素集合中的HTML 內(nèi)容

D、removeAttr( ): 設(shè)置或返回匹配元素的屬性和值

參考答案：D答案解析：暫無

7.下到關(guān)于DoS 攻擊的描述中，錯(cuò)誤的是？

A、DoS 攻擊通常通過抑制所有或流向某一特定目的端的消息，從而使系統(tǒng)某一實(shí)體不能執(zhí)行其正常功能，產(chǎn)生服務(wù)拒絕

B、DoS 攻擊不需入目標(biāo)系統(tǒng)，僅從外部就可實(shí)現(xiàn)攻擊

C、只要軟件系統(tǒng)內(nèi)部沒有漏洞，DoS 攻擊就不可能成功

D、死亡之Ping、Land 攻擊、UDP 洪水、Smurf 攻擊均是常見的DoS 攻擊手段

參考答案：C

答案解析：服務(wù)拒絕：當(dāng)一個(gè)實(shí)體不能執(zhí)行它的正常功能，或它的動(dòng)作妨礙了別的實(shí)體執(zhí)行它們的正常功能的時(shí)候，便發(fā)生服務(wù)拒絕。這種攻擊不一定需要目標(biāo)系統(tǒng)存在漏洞，如UDP 洪水。

8.在面向?qū)ο筌浖_發(fā)過程中，采用設(shè)計(jì)模式（）。

A、允許在非面向?qū)ο蟪绦蛟O(shè)計(jì)語言中使用面向?qū)ο蟮母拍?/p>

B、以復(fù)用成功的設(shè)計(jì)和體系結(jié)構(gòu)

C、以減少設(shè)計(jì)過程創(chuàng)建的類的個(gè)數(shù)

D、以保證程序的運(yùn)行速度達(dá)到最優(yōu)值參考答案：B

答案解析：B。

設(shè)計(jì)模式的出現(xiàn)就是為了代碼復(fù)用，增加可維護(hù)性。

9.Java 的核心包中，提供編程應(yīng)用的基本類的包是（）。

A、java．lang

B、java．util

C、java．a(chǎn)pplet

D、java．rmi

參考答案：A

答案解析：暫無

10.下列media queries 的定義方式中，哪一個(gè)是適配iphone6s 的？

A、．@media(min-device-width:375px)and(max-device-width:667px)and(-webkit-min-device-pixel-ratio:2){}

B、．@media(min-device-width:414px)and(max-device-width:736px)and(-webkit-min-device-pixel-ratio:3){}

C、@media only screen and(min-device-width:320px) and(max-device-width:480px) and(-webkit-device-pixel-ratio:2){}

D、@media only screen and(min-device-width:320px) and(max-device-width:568px) and(-webkit-min-device-pixel-ratio:2){}

參考答案：A

答案解析：不要糾結(jié)選擇A 或者選擇B 了主要是在-webkit-min-device-pixel-ratio:2 這個(gè)屬性想知道的去看看這邊文章（解釋是對(duì)的，但是這上面的設(shè)備像素比率有錯(cuò)）iPhone6s 是2 而plus 是3 設(shè)備像素比率看這個(gè)min-device-width 這個(gè)標(biāo)簽和我們平時(shí)寫的也有min-width 的區(qū)別我也學(xué)到了好好學(xué)習(xí)哈哈哈

11.在jquery 中，如果想要獲取當(dāng)前窗口的寬度值，下面哪個(gè)是實(shí)現(xiàn)該功能的？

A、width()

B、width(val)C、width

D、innerWidth()

參考答案：A

答案解析：

alert($(window).height()); <span style="color:rgb(0,128,0);">//瀏覽器當(dāng)前窗口可視區(qū)域高度</span>alert($(document).height()); <span style="color:rgb(0,128,0);">//瀏覽器當(dāng)前窗口文檔的高度</span>alert($(document.body).height());<spanstyle="color: rgb(0,128,0);">//瀏覽器當(dāng)前窗口文檔body 的高度</span>alert($(document.body).outerHeight(<spanstyle="color:rgb(0,0,255);">true</span>));<span style="color:rgb(0,128,0);">//瀏覽器當(dāng)前窗口文檔body 的總高度包括border padding margin </span>alert($(window).width()); <span style="color:rgb(0,128,0);">//瀏覽器當(dāng)前窗口可視區(qū)域?qū)挾?lt;/span>alert($(document).width());<span style="color:rgb(0,128,0);">//瀏覽器當(dāng)前窗口文檔對(duì)象寬度</span>alert($(document.body).width());<spanstyle="color: rgb(0,128,0);">//瀏覽器當(dāng)前窗口文檔body 的高度</span>alert($(document.body).outerWidth(<spanstyle="color:rgb(0,0,255);">true</span>));<span style="color:rgb(0,128,0);">//瀏覽器當(dāng)前窗口文檔body 的總寬度包括border padding margin </span>

12.如下HTML 代碼展示了一個(gè)用戶列表：-

用戶1 <button data-id="1">刪除</button>

- 用戶2 <button data-id="2">刪除</button>

- 用戶3 <button data-id="3">刪除</button>- 用戶4 <button data-id="4">刪除</button>

- 用戶5 <button data-id="5">刪除</button>

HTML

產(chǎn)品經(jīng)理期望管理員點(diǎn)擊“刪除”按鈕時(shí)可以刪除某個(gè)用戶，

關(guān)于實(shí)現(xiàn)該功能哪些描述是正確的：

A、首先需要為每個(gè)button 元素綁定點(diǎn)擊事件：$('button').on('click', removeUser);

B、通過點(diǎn)擊時(shí)間獲取用戶的ID：$(e.target).attr("data-id");

C、將列表項(xiàng)從頁面上刪除之前，需要先調(diào)用后端API，$.delete('/delete/user/xxx').then(() => { // 將用戶從頁面上移除})

D、在單頁應(yīng)用中，如果動(dòng)態(tài)添加一條新的用戶記錄，需要重新對(duì)該記錄的刪除按鈕進(jìn)行事件綁定。

參考答案：C

答案解析：

13.關(guān)于工廠模式，說法錯(cuò)誤的是？A、定義一個(gè)創(chuàng)建對(duì)象的接口，讓其子類自己決定實(shí)例化哪一個(gè)工廠類，工廠模式使其創(chuàng)建過程延遲到子類進(jìn)行

B、創(chuàng)建過程在其父類執(zhí)行

C、讓其子類實(shí)現(xiàn)工廠接口，返回的也是一個(gè)抽象的產(chǎn)品

D、主要解決接口選擇的問題

14.以下關(guān)于盒子模型描述正確的是：

A、標(biāo)準(zhǔn)盒子模型中：盒子的總寬度＝左右margin + 左右border + 左右padding + width

B、IE 盒子模型中：盒子總寬度＝左右margin + 左右border + width

C、標(biāo)準(zhǔn)盒子模型中：盒子的總寬度＝左右margin + 左右border + width

D、IE 盒子模型中：盒子總寬度＝width

15.head 標(biāo)簽中必不少的是（）

head 標(biāo)簽中必不少的是（）

A、<meta>

B、<link>

C、<title>

D、<script>16.下面符號(hào)中，不屬于JavaScript 運(yùn)算符的是（）

A、$#

B、&&

C、==

D、=

17.在HTML 頁面中,插入CSS 樣式表的形式不包括（）

A、嵌入式

B、索引式

C、外部式

D、內(nèi)聯(lián)式

18.下列html 元素當(dāng)中，都屬于塊級(jí)元素的是

A、h3，ul，form，table，p

B、h2，table，ul，a，input

C、p，ul，form，div，strong

D、div，p，h1，table，span

19.JS 閉包使用場(chǎng)景，錯(cuò)誤的是（）

A、迭代器

B、生成器C、數(shù)據(jù)緩存

D、釋放內(nèi)存

20.把鼠標(biāo)移到按鈕并點(diǎn)擊時(shí)，會(huì)產(chǎn)生一串什么樣的事件？

A、active hover focus

B、foucs hover active

C、hover active foucus

D、hover focus active

21.下面正則表達(dá)式匹配哪個(gè)字符串？

re = /(?<=z)abc(?=:)/

A、z:abc:z

B、:abcz

C、zabc:

D、:zabc

參考答案：C

答案解析：(?<=z) 表示匹配以(z)開頭的字符串，并且捕獲(存儲(chǔ))到分組中(?=:)表示匹配以(:)結(jié)尾的字符串，并且捕獲(存儲(chǔ))到分組中二、多選題（共8 題，每題5 分）

1.關(guān)于Web 語義化的說法，正確的有？

A、語義化的含義就是用正確的標(biāo)簽做正確的事情

B、語義化讓頁面的內(nèi)容結(jié)構(gòu)化，結(jié)構(gòu)更清晰

C、語義化便于對(duì)瀏覽器、便于代碼閱讀、便于維護(hù)

D、語義化便于SEO, 頁面中多放置一些H1 標(biāo)簽，會(huì)提高

網(wǎng)頁的排名

參考答案：A,B,C

答案解析：h1 擁有最高的權(quán)值，在一個(gè)頁面中最好指使用1個(gè)h1 來突出你的內(nèi)容，太多的h1 會(huì)分散其整個(gè)頁面的權(quán)重，對(duì)搜索引擎也是非常的不友好。

2.JavaScript 中==運(yùn)算符的說法正確的有？

A、如果兩個(gè)值類型相同，按照===比較方法進(jìn)行比較

B、如果其中一個(gè)值是null，另一個(gè)是undefined，它們相等

C、如果一個(gè)值是數(shù)字另一個(gè)是字符串，將字符串轉(zhuǎn)換為數(shù)字進(jìn)行比較

D、如果一個(gè)值是對(duì)象，另一個(gè)是數(shù)字或字符串，將對(duì)象轉(zhuǎn)換為原始值然后用==規(guī)則繼續(xù)比較參考答案：A,B,C,D

答案解析：

==運(yùn)算符判斷相等的流程是怎樣的如果兩個(gè)值類型相同，按照===比較方法進(jìn)行比較如果類型不同，使用如下規(guī)則進(jìn)行比較如果其中一個(gè)值是null，另一個(gè)是undefined，它們相等如果一個(gè)值是數(shù)字另一個(gè)是字符串，將字符串轉(zhuǎn)換為數(shù)字進(jìn)行比較如果有布爾類型，將true 轉(zhuǎn)換為1，false 轉(zhuǎn)換為0，然后用==規(guī)則繼續(xù)比較如果一個(gè)值是對(duì)象，另一個(gè)是數(shù)字或字符串，將對(duì)象轉(zhuǎn)換為原始值然后用==規(guī)則繼續(xù)比較其他所有情況都認(rèn)為不相等

3.給定一個(gè)正則表達(dá)式，請(qǐng)選擇它能匹配成功的項(xiàng)。（）

re = /^[aeiou]*d$/

A、d

B、aeioud

C、uoiead

D、aaad

參考答案：A,B,C,D答案解析：^表示以某個(gè)字符或字符串開頭*表示包含前面字符串0 個(gè)或多個(gè)$表示以某個(gè)字符或字符串結(jié)尾.

4.哪些設(shè)計(jì)模式是降低資源使用率：

A、prototype

B、singleton

C、flyweight

D、abstract factory

5.以下哪些HTML 標(biāo)簽屬于行內(nèi)元素:

A、`p`

B、`span`

C、`canvas`

D、`label`

E、`img`

6.JavaScript 中關(guān)于===運(yùn)算符說法正確的有？

A、如果兩個(gè)值都是null 或者都是undefined，它們相等

B、如果兩個(gè)值都是布爾類型true 或者都是false，它們相等

C、如果其中有一個(gè)是NaN，它們不相等

D、如果都是數(shù)值型并且數(shù)值相等，他們相等，-0 等于0

7.給定如下HTML 代碼，以下選擇器能選到P 元素的是？

<div

class="box"> <div> YY </div> <p> 1231</p><

/div>

HTML

A、.box p

B、.box > p

C、.box + p

D、.box,p

8.常見的瀏覽器端的存儲(chǔ)技術(shù)有哪些？

A、cookie

B、localStorageC、session

D、userData

參考答案：A,B,D

答案解析：

**瀏覽器端：**

cookie

WebStorage(localStorage、sessionStorage)

userData

indexedDB

**服務(wù)器端：**

session