前端開發(fā)面試題及答案

前端開發(fā)面試題及答案

　　在社會的各個領(lǐng)域，我們總免不了要接觸或使用試題，試題是命題者根據(jù)測試目標(biāo)和測試事項(xiàng)編寫出來的。什么樣的試題才是科學(xué)規(guī)范的試題呢？下面是小編為大家整理的前端開發(fā)面試題及答案，歡迎大家借鑒與參考，希望對大家有所幫助。

　　前端開發(fā)面試題及答案

　　前端開發(fā)面試題及答案

　　1、對Web標(biāo)準(zhǔn)以及W3C的理解與認(rèn)識?

　　答：標(biāo)簽閉合、標(biāo)簽小寫、不亂嵌套、提高搜索機(jī)器人搜索幾率、使用外鏈CSS和JS腳本、結(jié)構(gòu)行為表現(xiàn)的分離、文件下載與頁面速度更快、內(nèi)容能被更多的用戶所訪問、內(nèi)容能被更廣泛的設(shè)備所訪問、更少的代碼和組件、容易維護(hù)、改版方便，不需要變動頁面內(nèi)容、提供打印版本而水需要復(fù)制內(nèi)容、提高網(wǎng)站易用性。

　　2、XHTML和HTML有什么區(qū)別?

　　答：HTML是一種基本的WEB網(wǎng)頁設(shè)計(jì)語言，XHTML是一個基于XML的置標(biāo)語言 最主要的不同：

　　XHTML元素必須被正確地嵌套;

　　XHTML元素必須被關(guān)閉;

　　標(biāo)簽名必須用小寫字母;

　　XHTML文檔必須擁有根元素。

　　3、Doctype?嚴(yán)格模式與混雜模式-如何觸發(fā)這兩種模式，區(qū)分它們有何意義? 答：Doctype用于聲明文檔使用哪種規(guī)范(HTML/XHTML)

　　該標(biāo)簽可聲明三種DTD類型，分別為嚴(yán)格版本、過度版本以及基于框架的HTML文檔。

　　加入XML聲明可觸發(fā)，解析方式更改為IE5.5擁有IE5.5的bug。

　　4、行內(nèi)元素有哪些?塊級元素有哪些?CSS的盒模型?

　　答：行內(nèi)元素：a b br i span input select

　　塊級元素：div p h1 h2 h3 h4 form ul

　　CSS盒模型：內(nèi)容，border margin padding

　　5、CSS引入的方式有哪些?link和@import的區(qū)別是?

　　答：方式：內(nèi)聯(lián) 內(nèi)嵌 外鏈 導(dǎo)入

　　區(qū)別：同時(shí)加載

　　前者無兼容性，后者CSS2.1以下瀏覽器不支持

　　Link支持使用javascript 改變樣式，后者不可。

　　6.CSS選擇符有哪些?哪些屬性可以繼承?優(yōu)先級算法如何計(jì)算?內(nèi)聯(lián)和important哪個優(yōu)先級高?

　　答：標(biāo)簽選擇符、類選擇符、id選擇符

　　繼承不如指定 id>class>標(biāo)簽選擇

　　后者優(yōu)先級高

　　7、前端頁面有哪三層構(gòu)成，分別是什么?作用是什么?

　　答：結(jié)構(gòu)層HTML 表示層CSS 行為層JS

　　8、你做的頁面在哪些瀏覽器測試過?這些瀏覽器的內(nèi)核分別是什么? 答：Ie(Ie內(nèi)核)

　　火狐(Gecko)

　　谷歌(webkit)

　　opear(Presto)

　　9、img標(biāo)簽上title與 alt屬性的區(qū)別是什么?

　　答：Alt當(dāng)圖片不顯示時(shí)，用文字代表

　　Title為該屬性提供信息。

　　10、描述CSS Reset的作用和用途

　　答：Reset重置瀏覽器的CSS默認(rèn)屬性 瀏覽器的品種不同，樣式不同，然后重

　　置，讓他們統(tǒng)一。

　　11、http狀態(tài)碼有那些?分別代表是什么意思?

　　100-199 用于指定客戶端應(yīng)響應(yīng)的某些動作。

　　200-299 用于表示請求成功。

　　300-399 用于已經(jīng)移動的文件并且常被包含在定位頭信息中指定新的地址信息。 400-499 用于指出客戶端的錯誤。

　　400 語義有誤，當(dāng)前請求無法被服務(wù)器理解。

　　401 當(dāng)前請求需要用戶驗(yàn)證

　　403 服務(wù)器已經(jīng)理解請求，但是拒絕執(zhí)行它。

　　500-599 用于支持服務(wù)器錯誤。

　　503 – 服務(wù)不可用

　　13.解釋css sprites，如何使用。

　　Css 精靈 把一堆小的圖片整合到一張大的圖片上，減輕服務(wù)器對圖片的請求數(shù)量

　　14.瀏覽器標(biāo)準(zhǔn)模式和怪異模式之間的區(qū)別是什么?

　　盒子模型 渲染模式的不同

　　使用 window.top.document.compatMode 可顯示為什么模式

　　15.你如何對網(wǎng)站的文件和資源進(jìn)行優(yōu)化?期待的解決方案包括：

　　文件合并

　　文件最小化/文件壓縮

　　使用CDN托管

　　緩存的使用

　　16.什么是語義化的HTML?

　　直觀的認(rèn)識標(biāo)簽 對于搜索引擎的抓取有好處

　　17.清除浮動的幾種方式，各自的優(yōu)缺點(diǎn)

　　1.使用空標(biāo)簽清除浮動 clear:both(理論上能清楚任何標(biāo)簽，增加無意義的標(biāo)簽)

　　2.使用overflow:auto(空標(biāo)簽元素清除浮動而不得不增加無意代碼的弊端,,使用zoom:1用于兼容IE)

　　3.是用afert偽元素清除浮動(用于非IE瀏覽器)

　　18.css hack

　　_marging \IE 6

　　+margin \IE 7

　　Marging:0 auto 9 所有Ie

　　Margin

　　前端開發(fā)面試題之Javascript部分

　　1.javascript的typeof返回哪些數(shù)據(jù)類型

　　Object number function boolean underfind

　　2.例舉3種強(qiáng)制類型轉(zhuǎn)換和2種隱式類型轉(zhuǎn)換?

　　強(qiáng)制(parseInt,parseFloat,number)

　　隱式(== – ===)

　　3.split() join() 的區(qū)別

　　前者是切割成數(shù)組的形式，后者是將數(shù)組轉(zhuǎn)換成字符串

　　4.數(shù)組方法pop() push() unshift() shift()

　　Push()尾部添加 pop()尾部刪除

　　Unshift()頭部添加 shift()頭部刪除

　　5.事件綁定和普通事件有什么區(qū)別

　　6.IE和DOM事件流的區(qū)別

　　1.執(zhí)行順序不一樣、

　　2.參數(shù)不一樣

　　3.事件加不加on

　　4.this指向問題

　　7.IE和標(biāo)準(zhǔn)下有哪些兼容性的寫法

　　Var ev = ev || window.event

　　document.documentElement.clientWidth || document.body.clientWidth

　　Var target = ev.srcElement||ev.target

　　8.ajax請求的時(shí)候get 和post方式的區(qū)別

　　一個在url后面 一個放在虛擬載體里面

　　有大小限制

　　安全問題

　　應(yīng)用不同 一個是論壇等只需要請求的，一個是類似修改密碼的

　　9.call和apply的區(qū)別

　　Object.call(this,obj1,obj2,obj3)

　　Object.apply(this,arguments)

　　10.ajax請求時(shí)，如何解釋json數(shù)據(jù)

　　使用eval parse 鑒于安全性考慮 使用parse更靠譜

　　11.b繼承a的方法

　　12.JavaScript this指針、閉包、作用域

　　13.事件委托是什么

　　讓利用事件冒泡的原理，讓自己的所觸發(fā)的事件，讓他的父元素代替執(zhí)行!

　　14.閉包是什么，有什么特性，對頁面有什么影響

　　閉包就是能夠讀取其他函數(shù)內(nèi)部變量的函數(shù)。

　　15.如何阻止事件冒泡和默認(rèn)事件

　　canceBubble return false

　　16.添加 刪除 替換 插入到某個接點(diǎn)的方法

　　obj.appendChidl()

　　obj.innersetBefore

　　obj.replaceChild

　　obj.removeChild

　　17.解釋jsonp的原理，以及為什么不是真正的ajax

　　動態(tài)創(chuàng)建script標(biāo)簽，回調(diào)函數(shù)

　　Ajax是頁面無刷新請求數(shù)據(jù)操作

　　18.javascript的本地對象，內(nèi)置對象和宿主對象

　　本地對象為array obj regexp等可以new實(shí)例化

　　內(nèi)置對象為gload Math 等不可以實(shí)例化的

　　宿主為瀏覽器自帶的document,window 等

　　19.document load 和document ready的區(qū)別

　　Document.onload 是在結(jié)構(gòu)和樣式加載完才執(zhí)行js

　　Document.ready原生種沒有這個方法，jquery中有 $().ready(function)

　　20.”==”和“===”的不同

　　前者會自動轉(zhuǎn)換類型

　　后者不會

　　21.javascript的同源策略

　　一段腳本只能讀取來自于同一來源的窗口和文檔的屬性，這里的同一來源指的是主機(jī)名、協(xié)議和端口號的組合

　　前端開發(fā)面試問答

　　Q：關(guān)于公司的期望

　　A：我希望第一份工作能有比較大的發(fā)展空間，能夠長時(shí)間的在一個良好的環(huán)境中養(yǎng)成良好的習(xí)慣。

　　Q：大學(xué)時(shí)經(jīng)歷的團(tuán)隊(duì)合作

　　A：最初的時(shí)候誰也不知道應(yīng)該做什么，就從理論上一點(diǎn)一點(diǎn)的摳出東西來，經(jīng)過兩三次的課程我們的固定團(tuán)隊(duì)大致有了自己的開發(fā)流程，知道怎么樣進(jìn)行相互間的交流溝通、協(xié)作，也能從其他團(tuán)隊(duì)的匯報(bào)中吸取很多經(jīng)驗(yàn)與教訓(xùn)。有的時(shí)候我們團(tuán)隊(duì)里會加進(jìn)比較牛的高人，他也會愿意對我們進(jìn)行額外的指導(dǎo)，大家一起交流想法，各自說出來，再一起逐一分析優(yōu)劣，最終定下方案。

　　Q：關(guān)于前端的理解

　　A：前端開發(fā)處于一個猛烈發(fā)展的階段，現(xiàn)在可以說大部分的網(wǎng)站都在關(guān)注前端，前端是直接接觸用戶的部分，它融合了設(shè)計(jì)、程序還有一些整體的理念，一些優(yōu)化，包括SEO。很多技術(shù)的實(shí)現(xiàn)都要通過前端，怎么把這部分做好是非常具有挑戰(zhàn)性的事情。可能四五年前很多人都還在標(biāo)準(zhǔn)的實(shí)現(xiàn)上摸索，而現(xiàn)在有一個大家都朝著標(biāo)準(zhǔn)走的大方向，就能夠更好的堅(jiān)持，更好的專注，把前端技術(shù)做得更強(qiáng)大。

　　Q：自己的發(fā)展計(jì)劃

　　A：剛畢業(yè)的這一兩年希望能專注于技術(shù)的提高，和適應(yīng)良好的工作流程――這也是為什么我希望能夠在一個發(fā)展環(huán)境良好的公司工作，鍛煉好實(shí)踐能力，結(jié)合公司的產(chǎn)品需求，當(dāng)然還有一些不斷萌發(fā)的新技術(shù)。之后會向產(chǎn)品的方向發(fā)展，就是前端技術(shù)所要實(shí)現(xiàn)的目標(biāo)，因?yàn)榍岸舜_實(shí)是結(jié)合很廣闊的一個職位。

　　Q：優(yōu)缺點(diǎn)

　　A：我的優(yōu)點(diǎn)，自己覺得是比較細(xì)心，包括細(xì)致的觀察還有處理細(xì)節(jié)上的事情。我之前在365日歷網(wǎng)實(shí)習(xí)的時(shí)候，還有課程小組學(xué)習(xí)的時(shí)候，他們評價(jià)我會說我比較可靠，我覺得可能不是那種技術(shù)上特別牛什么問題都能解決的，我個人覺得是來自細(xì)心和認(rèn)真負(fù)責(zé)的態(tài)度。另外后面在九星時(shí)代實(shí)習(xí)的時(shí)候，臨走上司對我評價(jià)是說我抗壓學(xué)習(xí)能力比較強(qiáng)。當(dāng)時(shí)項(xiàng)目特別急，又有涉及到一些我還不熟悉的技術(shù)，所有人都在加班，我也是一邊完成任務(wù)一邊不斷在學(xué)新的東西，進(jìn)一步的修繕，把事情做得更好。缺點(diǎn)的話，我覺得現(xiàn)在對我影響最大的就是想問題常常會有太多顧慮，想要一次性的把問題解決，結(jié)果會浪費(fèi)很多的時(shí)間。比如說技術(shù)面試的時(shí)候，很經(jīng)常遇到考官說一個簡單的布局設(shè)計(jì)讓你實(shí)現(xiàn)，我有的時(shí)候就總會考慮一些沒有提到的因素，像是否需要適應(yīng)變化這類的，就是有些過于計(jì)較完美，反而變得優(yōu)柔寡斷了。這也是有次面試的時(shí)候面試官和我提到的。

　　Q：待遇要求

　　A：待遇的話，我覺得并不是很關(guān)鍵，而且我是應(yīng)屆生，我尊重公司對應(yīng)屆生的待遇標(biāo)準(zhǔn)。我也相信網(wǎng)易的競爭力吧。這幾次面試后，我在網(wǎng)上查了不少別人的評價(jià)，覺得網(wǎng)易作為大門戶網(wǎng)站，有很好的環(huán)境與發(fā)展前景，薪水的話能讓自己繼續(xù)活著工作學(xué)習(xí)發(fā)展就夠啦。我

　　一直認(rèn)為如果公司發(fā)展前景不好，現(xiàn)在給很高的工資也不一定就是好事情，而好的公司能夠給出符合員工給自己所創(chuàng)造的價(jià)值的工資。

　　3號（周四）下午，面試的時(shí)候HR羅叔叔非常溫和，常常笑，說話也不是我想象中HR那種咄咄逼人的語速。問我的問題大約是：

　　Q：自我介紹包括實(shí)習(xí)經(jīng)歷

　　A：如實(shí)匯報(bào)

　　Q：面對過什么樣的壓力

　　A：我先是很宓乃盜搜數(shù)學(xué)的事情，后來HR又問，還有其他的嗎，我又說了一下做一些課程設(shè)計(jì)的時(shí)候小組遇到的難題，技術(shù)和團(tuán)隊(duì)協(xié)作方面。其實(shí)還想說在九星實(shí)習(xí)的時(shí)候的工作壓力，后來覺得這個才是HR最想聽的，不過沒有機(jī)會說了……

　　Q：解決問題的方法

　　A：技術(shù)問題的話，先上網(wǎng)查有沒有解決的方法，如果不好解決再去請教前輩，一般還是自己先查一些資料，不想為簡單的問題就打擾別人。如果遇到難以解決的問題會請教別人或者和別人一起討論。這塊回答得有點(diǎn)亂。

　　Q：為什么想留在北京

　　A：家里人也希望我能夠獨(dú)立，能夠做自己喜歡的事情，在廣闊的空間里發(fā)展。我自己也覺得北京機(jī)會更多。我說完HR叔叔還跟著說了一句，確實(shí)比如你在福州，不要說福州吧，就算和上海深圳這樣的技術(shù)發(fā)達(dá)城市比，確實(shí)北京的機(jī)會是更多的。

　　Q：拿過其他公司的offer嗎？覺得和其他公司比，網(wǎng)易好在哪里？

　　A：有過一些，自己不滿意的地方，一種是職位不是自己期望的，比如測試或者技術(shù)支持，并不是自己第一想要做的事情，我很喜歡前端，也希望自己能在這個領(lǐng)域發(fā)展；還有是公司規(guī)模不大，像之前HR說的，在網(wǎng)易會有很多個前端工程師來完成一個大任務(wù)，我認(rèn)為這樣更能夠發(fā)揮自己的力量，也能讓自己的能力更好的發(fā)展，如果在一個小一些的公司，也許做前端的就只有我一個人，發(fā)展就會變得狹隘；還有工資問題，有的公司只給出兩千五左右的待遇（我沒敢說2000，其實(shí)之前確實(shí)有給我開2000的，怕被HR叔叔鄙視），這樣在北京生活會艱難一些。總的還是覺得發(fā)展前景很重要。然后HR叔叔就接過話說網(wǎng)易確實(shí)有很大的發(fā)展空間，而且工資的話我看你在登記表上寫的跨度很大（我寫的是3000-5000，遵從公司對應(yīng)屆生的薪酬標(biāo)準(zhǔn)），這點(diǎn)網(wǎng)易肯定能夠讓你滿意的。

　　Q：描述一下你的性格

　　A：這是我認(rèn)為我回答得最失敗的一個問題，我當(dāng)時(shí)沒多想，脫口而出――我性格比較內(nèi)向，其實(shí)我應(yīng)該說我溫柔善良細(xì)心負(fù)責(zé)，之前想了很多關(guān)于優(yōu)缺點(diǎn)的描述，結(jié)果也不曉得哪根筋抽抽了，直接說自己內(nèi)向，接著羞澀的笑笑，接了一句不過我很喜歡和別人討論問題，覺得一起解決問題是很開心的事情

【前端開發(fā)面試題及答案】相關(guān)文章：

前端開發(fā)的面試題11-17

web前端js面試題及參考答案07-21

PHP前端開發(fā)中的性能09-15

網(wǎng)頁設(shè)計(jì)前端面試題集合11-18

Java開發(fā)崗位面試題11-09

網(wǎng)頁設(shè)計(jì)和web前端開發(fā)哪個好12-01

Java開發(fā)崗位面試題匯總11-11

PHP面試題及答案03-05

精選php面試題及答案07-24