web前端开发面试题（答案）
1.xhtml和html有什么區(qū)別？
HTML是一種基本的WEB網(wǎng)頁設(shè)計語言，XHTML是一個基于XML的置標(biāo)語言
最主要的不同：
XHTML 元素必須被正確地嵌套。
XHTML 元素必須被關(guān)閉。
標(biāo)簽名必須用小寫字母。
XHTML 文檔必須擁有根元素。
2.行內(nèi)元素有哪些?塊級元素有哪些?CSS的盒模型?
塊級元素：div p h1 h2 h3 h4 form ul
行內(nèi)元素: a b br i span input select
Css盒模型:內(nèi)容，border ,margin，padding
3.CSS引入的方式有哪些? link和@import的區(qū)別是?
內(nèi)聯(lián) 內(nèi)嵌 外鏈 導(dǎo)入
區(qū)別 ：同時加載
前者無兼容性，后者CSS2.1以下瀏覽器不支持
Link 支持使用javascript改變樣式，后者不可
4.你做的頁面在哪些流覽器測試過?這些瀏覽器的內(nèi)核分別是什么?
IE: trident內(nèi)核
Firefox：gecko內(nèi)核
Safari：webkit內(nèi)核
Opera：以前是presto內(nèi)核，Opera現(xiàn)已改用Google Chrome的Blink內(nèi)核
Chrome：Blink(基于webkit，Google與Opera Software共同開發(fā))
5.寫出幾種IE6 BUG的解決方法
1.雙邊距BUG float引起的 使用display
2.3像素問題 使用float引起的 使用dislpay:inline -3px
3.超鏈接hover 點擊后失效 使用正確的書寫順序 link visited hover active
4.Ie z-index問題 給父級添加position:relative
5.Png 透明 使用js代碼 改
6.Min-height 最小高度 ！Important 解決’
7.select 在ie6下遮蓋 使用iframe嵌套
8.為什么沒有辦法定義1px左右的寬度容器（IE6默認的行高造成的，使用over:hidden,zoom:0.08 line-height:1px）
6.你如何對網(wǎng)站的文件和資源進行優(yōu)化?期待的解決方案包括：
文件合并
文件最小化/文件壓縮
使用CDN托管
緩存的使用
7.清除浮動的幾種方式，各自的優(yōu)缺點
1.使用空標(biāo)簽清除浮動 clear:both（理論上能清楚任何標(biāo)簽，，，增加無意義的標(biāo)簽）
2.使用overflow:auto（空標(biāo)簽元素清除浮動而不得不增加無意代碼的弊端,,使用zoom:1用于兼容IE）
3.是用afert偽元素清除浮動(用于非IE瀏覽器)
8.”==”和“===”的不同
前者會自動轉(zhuǎn)換類型
后者不會
9.簡述同步和異步的區(qū)別
同步是阻塞模式，異步是非阻塞模式。
同步就是指一個進程在執(zhí)行某個請求的時候，若該請求需要一段時間才能返回信息，那么這個進程將會一直等待下去，直到收到返回信息才繼續(xù)執(zhí)行下去；
異步是指進程不需要一直等下去，而是繼續(xù)執(zhí)行下面的操作，不管其他進程的狀態(tài)。當(dāng)有消息返回時系統(tǒng)會通知進程進行處理，這樣可以提高執(zhí)行的效率。
10.px和em的區(qū)別
px和em都是長度單位，區(qū)別是，px的值是固定的，指定是多少就是多少，計算比較容易。em得值不是固定的，并且em會繼承父級元素的字體大小。
瀏覽器的默認字體高都是16px。所以未經(jīng)調(diào)整的瀏覽器都符合: 1em=16px。那么12px=0.75em, 10px=0.625em
11.一次完整的HTTP事物是怎樣的一個過程？
基本流程：
a. 域名解析
b. 發(fā)起TCP的3次握手
c. 建立TCP連接后發(fā)起http請求
d. 服務(wù)器端響應(yīng)http請求，瀏覽器得到html代碼
e. 瀏覽器解析html代碼，并請求html代碼中的資源
f. 瀏覽器對頁面進行渲染呈現(xiàn)給用戶
12.你所了解的web攻擊技術(shù)
（1）XSS（Cross-Site Scripting，跨站腳本攻擊）：指通過存在安全漏洞的Web網(wǎng)站注冊用戶的瀏覽器內(nèi)運行非法的HTML標(biāo)簽或者JavaScript進行的一種攻擊。
（2）SQL注入攻擊
（3）CSRF（Cross-Site Request Forgeries，跨站點請求偽造）：指攻擊者通過設(shè)置好的陷阱，強制對已完成的認證用戶進行非預(yù)期的個人信息或設(shè)定信息等某些狀態(tài)更新。
13.html5有哪些新特性？如何處理HTML5新標(biāo)簽的瀏覽器兼容問題？如何區(qū)分?HTML?和?HTML5？
(1)繪畫?canvas;
(2)用于媒介回放的?video?和?audio?元素;
(3)本地離線存儲?localStorage?長期存儲數(shù)據(jù)，瀏覽器關(guān)閉后數(shù)據(jù)不丟失;
(4)sessionStorage?的數(shù)據(jù)在瀏覽器關(guān)閉后自動刪除;
(5)語意化更好的內(nèi)容元素，比如?article、footer、header、nav、section;
(6)表單控件，calendar、date、time、email、url、search;
(7)新的技術(shù)webworker, websocket, Geolocation;
? ? ? ?IE8/IE7/IE6支持通過document.createElement方法產(chǎn)生的標(biāo)簽，
可以利用這一特性讓這些瀏覽器支持HTML5新標(biāo)簽，
瀏覽器支持新標(biāo)簽后，還需要添加標(biāo)簽?zāi)J的樣式。
當(dāng)然也可以直接使用成熟的框架、比如html5shim
14.HTTP狀態(tài)碼知道哪些？
100 Continue?繼續(xù)，一般在發(fā)送post請求時，已發(fā)送了http header之后服務(wù)端將返回此信息，表示確認，之后發(fā)送具體參數(shù)信息
200 OK?正常返回信息
201 Created?請求成功并且服務(wù)器創(chuàng)建了新的資源
202 Accepted?服務(wù)器已接受請求，但尚未處理
301 Moved Permanently?請求的網(wǎng)頁已永久移動到新位置。
302 Found?臨時性重定向。
303 See Other?臨時性重定向，且總是使用?GET?請求新的?URI。
304 Not Modified?自從上次請求后，請求的網(wǎng)頁未修改過。
400 Bad Request?服務(wù)器無法理解請求的格式，客戶端不應(yīng)當(dāng)嘗試再次使用相同的內(nèi)容發(fā)起請求。
401 Unauthorized?請求未授權(quán)。
403 Forbidden?禁止訪問。
404 Not Found?找不到如何與?URI?相匹配的資源。
500 Internal Server Error?最常見的服務(wù)器端錯誤。
503 Service Unavailable?服務(wù)器端暫時無法處理請求（可能是過載或維護）。
14.你有哪些性能優(yōu)化的方法？
? ? ? ?（1） 減少http請求次數(shù)：CSS Sprites, JS、CSS源碼壓縮、圖片大小控制合適；網(wǎng)頁Gzip，CDN托管，data緩存 ，圖片服務(wù)器。
（2） 前端模板?JS+數(shù)據(jù)，減少由于HTML標(biāo)簽導(dǎo)致的帶寬浪費，前端用變量保存AJAX請求結(jié)果，每次操作本地變量，不用請求，減少請求次數(shù)
（3） 用innerHTML代替DOM操作，減少DOM操作次數(shù)，優(yōu)化javascript性能。
（4） 當(dāng)需要設(shè)置的樣式很多時設(shè)置className而不是直接操作style。
（5） 少用全局變量、緩存DOM節(jié)點查找的結(jié)果。減少IO讀取操作。
（6） 避免使用CSS Expression（css表達式)又稱Dynamic properties(動態(tài)屬性)。
（7） 圖片預(yù)加載，將樣式表放在頂部，將腳本放在底部 加上時間戳。
15.哪些常見操作會造成內(nèi)存泄漏？
? ? ? ?內(nèi)存泄漏指任何對象在您不再擁有或需要它之后仍然存在。
垃圾回收器定期掃描對象，并計算引用了每個對象的其他對象的數(shù)量。如果一個對象的引用數(shù)量為?0（沒有其他對象引用過該對象），或?qū)υ搶ο蟮奈┮灰檬茄h(huán)的，那么該對象的內(nèi)存即可回收。
setTimeout?的第一個參數(shù)使用字符串而非函數(shù)的話，會引發(fā)內(nèi)存泄漏。
閉包、控制臺日志、循環(huán)（在兩個對象彼此引用且彼此保留時，就會產(chǎn)生一個循環(huán)）。
16.線程與進程的區(qū)別
? ? ? ?一個程序至少有一個進程,一個進程至少有一個線程。
線程的劃分尺度小于進程，使得多線程程序的并發(fā)性高。
另外，進程在執(zhí)行過程中擁有獨立的內(nèi)存單元，而多個線程共享內(nèi)存，從而極大地提高了程序的運行效率。
線程在執(zhí)行過程中與進程還是有區(qū)別的。每個獨立的線程有一個程序運行的入口、順序執(zhí)行序列和程序的出口。但是線程不能夠獨立執(zhí)行，必須依存在應(yīng)用程序中，由應(yīng)用程序提供多個線程執(zhí)行控制。
從邏輯角度來看，多線程的意義在于一個應(yīng)用程序中，有多個執(zhí)行部分可以同時執(zhí)行。但操作系統(tǒng)并沒有將多個線程看做多個獨立的應(yīng)用，來實現(xiàn)進程的調(diào)度和管理以及資源分配。這就是進程和線程的重要區(qū)別。
17.null和undefined的區(qū)別？
? ? ? ?null是一個表示"無"的對象，轉(zhuǎn)為數(shù)值時為0；undefined是一個表示"無"的原始值，轉(zhuǎn)為數(shù)值時為NaN。
undefined：
（1）變量被聲明了，但沒有賦值時，就等于undefined。
（2)?調(diào)用函數(shù)時，應(yīng)該提供的參數(shù)沒有提供，該參數(shù)等于undefined。
（3）對象沒有賦值的屬性，該屬性的值為undefined。
（4）函數(shù)沒有返回值時，默認返回undefined。
null：
（1） 作為函數(shù)的參數(shù)，表示該函數(shù)的參數(shù)不是對象。
（2） 作為對象原型鏈的終點。
?
轉(zhuǎn)載于:https://www.cnblogs.com/chaihy/p/7201713.html
總結(jié)
以上是生活随笔為你收集整理的web前端开发面试题（答案）的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 常用的魔术方法
- 下一篇： 2017年html5行业报告,云适配发布