1、Web前端崗位面試題有哪些
1.對WEB標准以及W3C的理解與認識
標簽閉合、標簽小寫、不亂嵌套、提高搜索機器人搜索幾率、使用外 鏈css和js腳本、結構行為表現的分離、文件下載與頁面速度更快、內容能被更多的用戶所訪問、內容能被更廣泛的設備所訪問、更少的代碼和組件，容易維 護、改版方便，不需要變動頁面內容、提供列印版本而不需要復制內容、提高網站易用性；
2.xhtml和html有什麼區別
HTML是一種基本的WEB網頁設計語言，XHTML是一個基於XML的置標語言
最主要的不同：
XHTML 元素必須被正確地嵌套。
XHTML 元素必須被關閉。
標簽名必須用小寫字母。
XHTML 文檔必須擁有根元素。
3.Doctype? 嚴格模式與混雜模式-如何觸發這兩種模式，區分它們有何意義?
用於聲明文檔使用那種規范（html/Xhtml）一般為 嚴格 過度 基於框架的html文檔
加入XMl聲明可觸發，解析方式更改為IE5.5 擁有IE5.5的bug
4.行內元素有哪些?塊級元素有哪些?CSS的盒模型?
塊級元素：div p h1 h2 h3 h4 form ul
行內元素: a b br i span input select
Css盒模型:內容，border ,margin，padding
5.CSS引入的方式有哪些? link和@import的區別是?
內聯 內嵌 外鏈 導入
區別 ：同時載入
前者無兼容性，後者CSS2.1以下瀏覽器不支持
Link 支持使用javascript改變樣式，後者不可
6.CSS選擇符有哪些?哪些屬性可以繼承?優先順序演算法如何計算?內聯和important哪個優先順序高?
標簽選擇符 類選擇符 id選擇符
繼承不如指定 Id>class>標簽選擇
後者優先順序高
7.前端頁面有哪三層構成，分別是什麼?作用是什麼?
結構層 Html 表示層 CSS 行為層 js
8.css的基本語句構成是?
選擇器{屬性1:值1;屬性2:值2;……}
9.你做的頁面在哪些流覽器測試過?這些瀏覽器的內核分別是什麼?
Ie(Ie內核) 火狐（Gecko） 谷歌（webkit） opear(Presto)
10.寫出幾種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）
11.標簽上title與alt屬性的區別是什麼?
Alt 當圖片不顯示是 用文字代表。
Title 為該屬性提供信息
12.描述css reset的作用和用途。
Reset重置瀏覽器的css默認屬性 瀏覽器的品種不同，樣式不同，然後重置，讓他們統一
13.解釋css sprites，如何使用。
Css 精靈 把一堆小的圖片整合到一張大的圖片上，減輕伺服器對圖片的請求數量
14.瀏覽器標准模式和怪異模式之間的區別是什麼?
盒子模型 渲染模式的不同
使用 window.top.document.compatMode 可顯示為什麼模式
15.你如何對網站的文件和資源進行優化?期待的解決方案包括：
文件合並
文件最小化/文件壓縮
使用CDN託管
緩存的使用
16.什麼是語義化的HTML?
直觀的認識標簽 對於搜索引擎的抓取有好處
17.清除浮動的幾種方式，各自的優缺點
1.使用空標簽清除浮動 clear:both（理論上能清楚任何標簽，，，增加無意義的標簽）
2.使用overflow:auto（空標簽元素清除浮動而不得不增加無意代碼的弊端,,使用zoom:1用於兼容IE）
3.是用afert偽元素清除浮動(用於非IE瀏覽器)
Javascript
1.javascript的typeof返回哪些數據類型
Object number function boolean underfind
2.例舉3種強制類型轉換和2種隱式類型轉換?
強制（parseInt,parseFloat,number）
隱式（== – ===）
3.split() join() 的區別
前者是切割成數組的形式，後者是將數組轉換成字元串
4.數組方法pop() push() unshift() shift()
Push()尾部添加 pop()尾部刪除
Unshift()頭部添加 shift()頭部刪除
5.事件綁定和普通事件有什麼區別
6.IE和DOM事件流的區別
1.執行順序不一樣、
2.參數不一樣
3.事件加不加on
4.this指向問題
7.IE和標准下有哪些兼容性的寫法
Var ev = ev || window.event
document.documentElement.clientWidth || document.body.clientWidth
Var target = ev.srcElement||ev.target
8.ajax請求的時候get 和post方式的區別
一個在url後面 一個放在虛擬載體裡面
有大小限制
安全問題
應用不同 一個是論壇等只需要請求的，一個是類似修改密碼的
9.call和apply的區別
Object.call(this,obj1,obj2,obj3)
Object.apply(this,arguments)
10.ajax請求時，如何解釋json數據
使用eval parse 鑒於安全性考慮 使用parse更靠譜
11.b繼承a的方法
12.寫一個獲取非行間樣式的函數
function getStyle(obj,attr,value)
{
if(!value)
{
if(obj.currentStyle)
{
return obj.currentStyle(attr)
}
else
{
obj.getComputedStyle(attr,false)
}
}
else
{
obj.style[attr]=value
}
}
13.事件委託是什麼
讓利用事件冒泡的原理，讓自己的所觸發的事件，讓他的父元素代替執行！
14.閉包是什麼，有什麼特性，對頁面有什麼影響
閉包就是能夠讀取其他函數內部變數的函數。
15.如何阻止事件冒泡和默認事件
canceBubble return false
16.添加 刪除 替換 插入到某個接點的方法
obj.appendChidl()
obj.innersetBefore
obj.replaceChild
obj.removeChild
17.解釋jsonp的原理，以及為什麼不是真正的ajax
動態創建script標簽，回調函數
Ajax是頁面無刷新請求數據操作
2、面試Web前端需要注意什麼？會面試哪些問題？
作為一名HTML5前端工程師，為了工作，為了就業我們免不了要參加各種各樣的面試。為此總結了面試前的注意事項：
第一：注意自己的儀容儀表
面試之前，一定要再次從頭到腳地將自己的儀容儀表檢查一遍。檢查時主要包括，自己的牙縫是不是還有食物殘渣，所以你需要就近找一個衛生間，如果沒有衛生間就近找一個角落也是可以的，但是切記一定不要在大庭廣眾之下。因此，為了給自己整理出著裝的時間請在約定時間前20分鍾到達。
第二：再次檢查面試時所需的資料是否都已帶全
這些資料主要包括：身份證明、學歷文憑證明、個人簡歷、以往作品等等，如果這些東西齊全之後，需要對這些資料做一個整理與排序。因為沒有哪個面試官希望看到面試者拿出一堆「莫名其妙」的東西塞給他，讓他自己再一頁一頁的翻找自己需要的內容，如果說這些資料在面試官手中不小心散落一地，結果可想而知。這樣的求職者在面試官眼中也一定不是一個讓人放心、有條不紊的員工。當然如果檢查時發現資料沒有帶全，也不要緊張。反而你要慶倖幸虧及時檢查，也有足夠的時間組織語言去向面試官解釋。
第三：面試之前將通信工具調成振動或關閉狀態
雖然說面試者與面試官之間是一個平等的關系，但畢竟你是去人家公司求職的，始終處於一個被動的狀態，所以最起碼的尊重還是要做到的。曾經有調查顯示，對於面試過程中接電話或是被電話打斷的求職者，會被HR減分。
第四：等候面試官時，仔細觀察多了解面試公司
在等候面試官時，可以暗自觀察一下公司的大體情況比如員工的著裝風格、公司的LOGO或是貼在牆上的企業文化、公司的環境等等，一來可以在接下來的面試過程中表現出自己對公司的認同感，二來也可以讓自己對求職公司多些了解，以確定是否要接受這里的工作。如果你身邊有公司的資料宣傳架，不妨取一本翻看一下，也會增加HR對你的好感。
第五：放鬆心情，保持自信
面試時一定要保持一定的自信，這樣也會給面試官留下很好的印象。面試只是你步入工作的第一步，即便是失敗了那也是人生重要的經歷。失敗是為了更好的迎接下一個挑戰。
作為一名web前端工程師千萬不要覺得懂技術面試就能萬事大吉了，像以上五點細節性的東西也是一定要掌握的。
面試題系列：
網頁鏈接
3、如何面試網頁設計？
看你做那個行業的網頁設計了，現在網頁設計需求比較多的，1.是網路公司，專門給人做網站的，一般以量為主，加班比較多，但是有提成，裡面的設計師做到底也就設計部經理，然後慢慢升管理層，當然這要企業有空間升職的情況下來說的，也有做一輩子的網頁設計的，和銷售一樣，已知最好賺的是中企，每個網站提成5%，厲害的設計師可以做到月收入上W。2.私企，為自己公司做網站並維護，包括一些購物網，一個網站重復鼓搗，對設計本身發展不利，工作相對輕松無壓力，對員工要求比較全面，設計、切圖甚至代碼都要懂，做個兩三年人是變全面了，但是設計水平無法提高，如果企業小的話對以後發展不好。3.廣告公司，專門設計高端水平的網站，特別要求flash技術。加班是經常的，同時收入是豐富的。但是對平面設計也有要求，發展前景不錯，但是能力不夠的話壓力不是一般的大
4、網頁設計和前端攜帶的面試作品一般要到什麼水準
TOPVE唯藝互動認為這個不同的公司要求也是不一樣的，面試之前需要你先了解一下你所面試的公司的大概的情況是怎麼樣的，他們的網站或是產品的設計和前端水準在什麼程度，那你你的作品水準只要跟他們的水準相差不是太大的話就沒有什麼問題了。
5、web前端面試經常問到的面試題有哪些
Web前端經常被問到的面試題及答案
一、HTML+CSS
1.對WEB標准以及W3C的理解與認識
標簽閉合、標簽小寫、不亂嵌套、提高搜索機器人搜索幾率、使用外
鏈css和js腳本、結構行為表現的分離、文件下載與頁面速度更快、內容能被更多的用戶所訪問、內容能被更廣泛的設備所訪問、更少的代碼和組件，容易維
護、改版方便，不需要變動頁面內容、提供列印版本而不需要復制內容、提高網站易用性;
2.xhtml和html有什麼區別
HTML是一種基本的WEB網頁設計語言，XHTML是一個基於XML的置標語言
最主要的不同：
XHTML 元素必須被正確地嵌套。
XHTML 元素必須被關閉。
標簽名必須用小寫字母。
XHTML 文檔必須擁有根元素。
3.Doctype? 嚴格模式與混雜模式-如何觸發這兩種模式，區分它們有何意義?
用於聲明文檔使用那種規范(html/Xhtml)一般為 嚴格 過度 基於框架的html文檔
加入XMl聲明可觸發，解析方式更改為IE5.5 擁有IE5.5的bug
4.行內元素有哪些?塊級元素有哪些?CSS的盒模型?
塊級元素：div p h1 h2 h3 h4 form ul
行內元素: a b br i span input select
Css盒模型:內容，border ,margin，padding
5.CSS引入的方式有哪些? link和@import的區別是?
內聯 內嵌 外鏈 導入
區別 ：同時載入
前者無兼容性，後者CSS2.1以下瀏覽器不支持
Link 支持使用javascript改變樣式，後者不可
6.CSS選擇符有哪些?哪些屬性可以繼承?優先順序演算法如何計算?內聯和important哪個優先順序高?
標簽選擇符 類選擇符 id選擇符
繼承不如指定 Id>class>標簽選擇
後者優先順序高
7.前端頁面有哪三層構成，分別是什麼?作用是什麼?
結構層 Html 表示層 CSS 行為層 js
8.css的基本語句構成是?
選擇器{屬性1:值1;屬性2:值2;……}
9.你做的頁面在哪些流覽器測試過?這些瀏覽器的內核分別是什麼?
Ie(Ie內核) 火狐(Gecko) 谷歌(webkit) opear(Presto)
二、Javascript
1.javascript的typeof返回哪些數據類型
Object number function boolean underfind
2.例舉3種強制類型轉換和2種隱式類型轉換?
強制(parseInt,parseFloat,number)
隱式(== – ===)
3.split() join() 的區別
前者是切割成數組的形式，後者是將數組轉換成字元串
4.數組方法pop() push() unshift() shift()
Push()尾部添加 pop()尾部刪除
Unshift()頭部添加 shift()頭部刪除
5.事件綁定和普通事件有什麼區別
6.IE和DOM事件流的區別
1.執行順序不一樣、
2.參數不一樣
3.事件加不加on
4.this指向問題
7.IE和標准下有哪些兼容性的寫法
Var ev = ev || window.event
document.documentElement.clientWidth || document.body.clientWidth
Var target = ev.srcElement||ev.target
8.ajax請求的時候get 和post方式的區別
一個在url後面 一個放在虛擬載體裡面
有大小限制
安全問題
應用不同 一個是論壇等只需要請求的，一個是類似修改密碼的
9.call和apply的區別
Object.call(this,obj1,obj2,obj3)
Object.apply(this,arguments)
10.ajax請求時，如何解釋json數據
使用eval parse 鑒於安全性考慮 使用parse更靠譜
11.b繼承a的方法
12.寫一個獲取非行間樣式的函數
function getStyle(obj,attr,value)
{
if(!value)
{
if(obj.currentStyle)
{
return obj.currentStyle(attr)
}
else
{
obj.getComputedStyle(attr,false)
}
}
else
{
obj.style[attr]=value
}
}
6、前端開發 面試作品，不知道具體有什麼要求，是要以整個網站，還是幾個、一個頁面呢？
前台（端復）開發面試作品，一般對靜制態和設計部分要求較高：
1、必要的網頁布局和美術設計是必要的，在此，最好掌握HTML語言
2、CSS往往是必須要掌握的
3、JAVASCRIPT由於運行於前端，很多公司也會面試到這一部分，至少要了解
4、盡管你是應聘前端，但最好多少了解一些後台的工作
5、作品最好是個整站系統，或至少你參與的整站，你可以告訴老闆，前台或靜態部分，是你參入設計的
7、面試網頁設計有哪些問題
一、網頁設計面試的經典問題及答題思路：
問題一：「請你自我介紹一下」
思路：
1、這是面試的必考題目。
2、介紹內容要與個人簡歷相一致。
3、表述方式上盡量口語化。
4、要切中要害，不談無關、無用的內容。
5、條理要清晰，層次要分明。
6、事先最好以文字的形式寫好背熟。
回答要點：用10秒鍾簡單說說個人資料即可。用一分半鍾左右時間介紹你以前從事的工作，和所獲得的經驗。再用一分鍾左右時間描述你以前的工作經驗對應聘的這份職位來說有那些幫助。
問題二：「談談你的家庭情況」
思路：
1、況對於了解應聘者的性格、觀念、心態等有一定的作用，這是招聘單位問該問題的主要原因。
2、簡單地羅列家庭人。
3、宜強調溫馨和睦的家庭氛圍。
4、宜強調父母對自己教育的重視。
5、宜強調各位家庭成員的良好狀況。
6、宜強調家庭成員對自己工作的支持。
7、宜強調自己對家庭的責任感。
問題三：「你有什麼業余愛好？」
思路：
1、業余愛好能在一定程度上反映應聘者的性格、觀念、心態，這是招聘單位問該問題的主要原因。
2、最好不要說自己沒有業余愛好。
3、不要說自己有那些庸俗的、令人感覺不好的愛好。
4、最好不要說自己僅限於讀書、聽音樂、上網，否則可能令面試官懷疑應聘者性格孤僻。
5、最好能有一些戶外的業余愛好來「點綴」你的形象。
問題四：「你最崇拜誰？」
思路：
1、最崇拜的人能在一定程度上反映應聘者的性格、觀念、心態，這是面試官問該問題的主要原因。
2、不宜說自己誰都不崇拜。
3、不宜說崇拜自己。
4、不宜說崇拜一個虛幻的、或是不知名的人。
5、不宜說崇拜一個明顯具有負面形象的人。
6、所崇拜的人人最好與自己所應聘的工作能「搭」上關系。
7、最好說出自己所崇拜的人的哪些品質、哪些思想感染著自己、鼓舞著自己。
問題五：「你的座右銘是什麼？」
思路：
1、座右銘能在一定程度上反映應聘者的性格、觀念、心態，這是面試官問這個問題的主要原因。
2、不宜說那些醫引起不好聯想的座右銘。
3、不宜說那些太抽象的座右銘。
4、不宜說太長的座右銘。
5、座右銘最好能反映出自己某種優秀品質。
6、參考答案——「只為成功找方法，不為失敗找借口」
二、面試的注意事項：
(1)一旦和用人單位約好面試時間後，一定要提前5-10分鍾到達面試地點，以表示求職者的誠意，給對方以信任 感，同時也可調整自己的心態，作一些簡單的儀表准備，以免倉促上陣，手忙腳亂。為了做到這一點，一定要牢 記面試的時間地點，有條件的同學最好能提前去一趟，以免因一時找不到地方或途中延誤而遲到。如果遲到了， 肯定會給招聘者留下不好的印象，甚至會喪失面試的機會。
(2) 進入面試場合時不要緊張。 如門關著，應先敲門，得到允許後再進去。開關門動作要輕，以從容、自然為 好。見面時要向招聘者主動打招呼問好致意，稱呼應當得體。在用人單位沒有請你坐下時，切勿急於落座。用人 單位請你坐下時，應道聲「謝謝」。坐下後保持良好體態，切忌大大咧咧，左顧右盼，滿不在乎，以免引起反感 。離去時應詢問「還有什麼要問的嗎」，得到允許後應微笑起立，道謝並說「再見」。
(3) 對用人單位的 問題要逐一回答。 對方給你介紹情況時，要認真聆聽。為了表示你已聽懂並感興趣，可以在適當的時候點頭或 適當提問、答話。回答主試者的問題，口齒要清晰，聲音要適度，答話要簡練、完整。一般情況下不要打斷用人 單位的問話或搶問搶答，否則會給人急躁、魯莽、不禮貌的印象。問話完畢，聽不懂時可要求重復。當不能回答 某一問題時，應如實告訴用人單位，含糊其辭和胡吹亂侃會導致面試失敗。對重復的問題也要有耐心，不要表現 出不耐煩。
(4) 在整個面試過程中，在保持舉止文雅大方，談吐謙虛謹慎，態度積極熱情。 如果用人單位有兩位以上主試 人時，回答誰的問題，你的目光就應注視誰，並應適時地環顧其他主試人以表示你對他們的尊重。談話時，眼睛 要適時地注意對方，不要東張西望，顯得漫不經心，也不要眼皮低望，顯得缺乏自信，激動地與用人單位爭辯某 個問題也是不明智的舉動，冷靜地保持不卑不亢的風度是有益的。有的用人單位專門提一些無理的問題試探你的 反應，如果處理不好，容易亂了分寸，面試的效果顯然不會理想。
8、網頁設計工作的面試如何回答..
一般HR會這樣問：copy
1、以前在哪裡做，擔任什麼職位，主要負責什麼
2、為什麼離開上家公司
3、是否不成功案例，你認為你的案例中哪個最好
4、最後會問你薪資問題。
這里我挑2、4來回答，其它的我相信你應該知道怎麼回答。
對於第二個問題，很多HR都會問，這里你應該這樣回答比較合適：從兩方面，第一你可以說公司國轉型做其它項目，不做我現在這一塊的業務了。第二你可以說公司的發展方向與我的專業不太對，對我自己以後的發展不是很好，所以我想找一份與我專業對口的。
對於問題4，有可能是HR提出來，但也有可能沒提，這里你應該提出來。怎麼說沒關系，說出你要的價位就行，他就會知道了。然後他會根據公司的情況和你提的價位來跟你說明。你可以看公司的辦公環境以及員工的工作環境，就可以看出該公司老闆是否有錢了，呵呵！深圳這邊的網頁設計薪資挺難說的，有高有低。關鍵還是看能力與溝通技巧了。
好了，以上是我個人經驗，希望你能找到一份好工作，開心上班！
9、請問一下面試網頁設計師要准備什麼？面試時自我介紹該怎麼說？面試官會問什麼問題？
穿啥不重要，干凈整潔就好了。招這個職位其實有兩個方向：
如果對方則重設計感想招設計師的話，重點看你：作品設計風格是否成熟(就是玩ps的能力和你的美術底子)
如果人家不需要你設計，設計好了稿子丟給你，你的工作就只是搞切片、優化前端代碼的話，人家看你：網頁切片代碼是否合理規范、搞不搞得定css兼容、js掌握得如何、獨立解決技術問題的能力如何
不管看你上面，這行招聘最最重點會看你：有沒有經驗(書上說的學校教的東西和實際工作中用的完全是兩回事)，一般不招生手，除非是低工資給老手當助理，或招實習生。
可能現場試試你做東西的速度或檢驗下你的設計能力
10、面試網頁美工/網頁設計師,我需要注意哪些問題?
如果這個崗位即是美工，又是設計師，那就說明這家公司不是特別大的公司，一般大的公司網頁設計師和前端工程師是分開的，但是一些小的公司會把這兩個職位合並到一起。具體需要注意的情節：
1、對這個崗位要有自己的理解，你要讓領導知道你心目中的這個崗位是什麼樣子的，你對網頁美工/網頁設計師是怎麼理解的；
2、表現出對企業的忠誠，比如問你一個為什麼不在上一家企業工作了？你應該盡量避免說是自己浮躁，如果真是自己的原因，那也盡量表現出你會在這個企業長期待下去，沒有公司願意用三心二意的員工，有些時候忠誠比技能要重要；
3、盡量多帶一些成熟的作品，企業用你當然和你的技能分不開，從你的作品中企業可以看出你的真是水平。
4、如果有別的公共活動的證書什麼的盡量一並帶上，這樣可以給你加分；
5、盡量衣著得體，如果有條件盡量整裝，這樣可以顯得你對這次面試的重視；
6、如果能留面試官的電話盡量留面試官的電話，如果面試官不打算用你，你可以多打幾次電話爭取一下這個崗位，讓面試官看到你對這個崗位的渴望，不怕你不會，就怕你不做，一個很優秀但是不努力的人和一個很差勁但是很努力的人比，有些人還是比較喜歡後者的。
7、做足前期功課，要在去企業之前，對這個企業有了解，避免面試官問你關於這個行業的時候一問三不知的局面。