前端面試題

本章轉(zhuǎn)載自新浪博客網(wǎng)友:blog.sina.com.cn/s/blog_7f5571aa0102w2tv.html

HTML+CSS

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是一個(gè)基于XML的置標(biāo)語言

最主要的不同:

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

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

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

XHTML文檔必須擁有根元素。

3.Doctype?嚴(yán)格模式與混雜模式-如何觸發(fā)這兩種模式,區(qū)分它們有何意義?

用于聲明文檔使用那種規(guī)范(html/Xhtml)一般為嚴(yán)格過度基于框架的html文檔

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

4.行內(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

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哪個(gè)優(yōu)先級高?

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

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

后者優(yōu)先級高

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

結(jié)構(gòu)層Html表示層CSS行為層js

8.css的基本語句構(gòu)成是?

選擇器{屬性1:值1;屬性2:值2;……}

9.你做的頁面在哪些流覽器測試過?這些瀏覽器的內(nèi)核分別是什么?

Ie(Ie內(nèi)核)火狐(Gecko)谷歌(webkit)opear(Presto)

10.寫出幾種IE6 BUG的解決方法

1.雙邊距BUG float引起的使用display

2.3像素問題使用float引起的使用dislpay:inline -3px

3.超鏈接hover點(diǎn)擊后失效使用正確的書寫順序link visited hover active

4.Ie z-index問題給父級添加position:relative

5.Png透明使用js代碼改

6.Min-height最小高度!Important解決’

7.select在ie6下遮蓋使用iframe嵌套

8.為什么沒有辦法定義1px左右的寬度容器(IE6默認(rèn)的行高造成的,使用over:hidden,zoom:0.08 line-height:1px)

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

Alt當(dāng)圖片不顯示是用文字代表。

Title為該屬性提供信息

12.描述css reset的作用和用途。

Reset重置瀏覽器的css默認(rèn)屬性瀏覽器的品種不同,樣式不同,然后重置,讓他們統(tǒng)一

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瀏覽器)

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ū)別

一個(gè)在url后面一個(gè)放在虛擬載體里面

有大小限制

安全問題

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

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.寫一個(gè)獲取非行間樣式的函數(shù)

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.事件委托是什么

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

http://www.webasily.com/?p=78例子可見此鏈接

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

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

http://blog.csdn.net/gaoshanwudi/article/details/7355794此鏈接可查看(問這個(gè)問題的不是一個(gè)公司)

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

canceBubble return false

16.添加刪除替換插入到某個(gè)接點(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原生種沒有這個(gè)方法,jquery中有$().ready(function)

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

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

后者不會

21.javascript的同源策略

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

22.編寫一個(gè)數(shù)組去重的方法

function oSort(arr)

{

var result ={};

var newArr=[];

for(var i=0;i

{

if(!result[arr])

{

newArr.push(arr)

result[arr]=1

}

}

return newArr

}

來自IT公司面試手冊

[HTML && CSS]

1.Doctype嚴(yán)格模式與混雜模式-如何觸發(fā)這兩種模式,區(qū)分它們有何意義?

嚴(yán)格模式:使用此類型的網(wǎng)頁,瀏覽器解析將相對嚴(yán)格,不允許使用任何表現(xiàn)樣式的標(biāo)識和屬性,比如在元素中直接使用background-color背景色屬性。

混雜模式:瀏覽器對XHTML的解析較為寬松。允許使用4.01中的標(biāo)簽,但必須符合XHTML的語法。

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

行內(nèi)元素:span,a,var ,em,input,img,img,textarea,var,em,strong,select,

塊級標(biāo)簽:div,p,h1-h3,ul,ol,dl,li,dd,dt,table,td,tr,

CSS的盒模型:CSS布局中的每一個(gè)元素,在瀏覽器的解析中,都被當(dāng)做一個(gè)盒狀物。

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

CSS引入的方式

在html文檔的head部分加入:

在html文檔的head部分直接寫入css文檔。

直接在html標(biāo)簽里寫入對這個(gè)標(biāo)簽的css控制

測試信息

link和@import的區(qū)別是link寫在html頁面中,@import寫在CSS頁面中

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

CSS選擇符: 類選擇器 、 標(biāo)簽名選擇器、 ID選擇器 、 后代選擇器(派生選擇器)、 群組選擇器

可以繼承: 類選擇器 、 標(biāo)簽名選擇器、 后代選擇器(派生選擇器)、群組選擇器

優(yōu)先級算法:

標(biāo)簽內(nèi)直接定義:1000

ID選擇器:100

類選擇器 :10

標(biāo)簽名選擇器:1

內(nèi)聯(lián)和important中,important優(yōu)先級高

5:前端頁面有哪三層構(gòu)成,分別是什么?作用是什么?

結(jié)構(gòu)層;主要指DOM節(jié)點(diǎn);HTML/XHTML

樣式層;主要是指頁面渲染;CSS

腳本層:主要指頁面動畫效果;JS/AS

6:css的基本語句構(gòu)成是?

選擇符、屬性、值

8:你做的頁面在哪些流覽器測試過?這些瀏覽器的內(nèi)核分別是什么?經(jīng)常遇到的瀏覽器的兼容性有哪些?怎么會出現(xiàn)?解決方法是什么?

IE6、7、8、FF、Opear、Safari、Chrome、Maxthon

Trident:Windows 下的 IE 瀏覽器使用的內(nèi)核代號。除 IE 外,眾多的 IE Shell(如 Maxthon )都使用這個(gè)內(nèi)核。

Gecko:Mozilla Firefox 瀏覽器使用的內(nèi)核代號。

Presto:Opera 瀏覽器使用的內(nèi)核代號,這是目前公認(rèn)網(wǎng)頁瀏覽速度最快的瀏覽器內(nèi)核。

KHTML/WebCore: Konqueror/Safari 瀏覽器使用的內(nèi)核代號。

經(jīng)常遇到的瀏覽器兼容問題:

1.在有的瀏覽器中,默認(rèn)字體大小為12px,所以在設(shè)字體大小的時(shí)候,最小設(shè)為12px,如果在做的過程中,發(fā)現(xiàn)字體小于12,可直接作為圖片使用

2.a標(biāo)簽對里不能嵌套a標(biāo)簽對

3.若給a標(biāo)簽內(nèi)的內(nèi)容樣式加上樣式,需要設(shè)置display:block;(在IE中如果設(shè)置寬高會自動變成塊,在FF中則不會),但如果設(shè)置了float屬性,就不需要設(shè)置display:block。

4.ul,ol在FF默認(rèn)情況下,有l(wèi)ist-style-type樣式和padding值,dl在IE和FF默認(rèn)情況下,有padding值,所以應(yīng)該事先聲明ul,li,ol,dl,dd,dd{margin:0;padding:0}。

5.作為外部 wrapper 的 div 不要定死高度, 最好還加上 overflow: hidden.以達(dá)到高度自適應(yīng)

6.關(guān)于手形光標(biāo). cursor: pointer. 而hand 只適用于 IE.

7.css布局中的居中問題:在父級元素定義TEXT-ALIGN: center;這個(gè)的意思就是在父級元素內(nèi)的內(nèi)容居中;對于IE這樣設(shè)定就已經(jīng)可以了。但在mozilla中不能居中。解決辦法就是在子元素定義時(shí)候設(shè)定時(shí)再加上“margin-right: auto;margin-left: auto; ”需要說明的是,如果你想用這個(gè)方法使整個(gè)頁面要居中,建議不要套在一個(gè)DIV里,你可以依次拆出多個(gè)div,只要在每個(gè)拆出的div里定義margin-right: auto;margin-left: auto; 就可以了。

8.浮動ie產(chǎn)生的雙倍距離

#box{ float:left; width:100px; margin:0 0 0 100px; //這種情況之下IE會產(chǎn)生200px的距離,這時(shí)需要設(shè)置display:inline; //使浮動忽略}

9.如何居中一個(gè)浮動元素?

對其設(shè)置margin:x auto;

10.有沒有關(guān)注HTML5和CSS3?如有請簡單說一些您對它們的了解情況!

有,HTML5的是目前正在為未來的HTML標(biāo)準(zhǔn)的主要修訂的發(fā)展。其前任一樣,4.01和XHTML 1.1的HTML,HTML5的是一個(gè)結(jié)構(gòu)和提交萬維網(wǎng)內(nèi)容的標(biāo)準(zhǔn)。新標(biāo)準(zhǔn)結(jié)合了諸如視頻播放,拖動和放下以前曾在第三方瀏覽器插件依賴?yán)鏏dobe Flash,微軟的Silverlight的功能,和谷歌齒輪。

12:如果讓你來制作一個(gè)訪問量很高的大型網(wǎng)站,你會如何來管理所有CSS文件、JS與圖片?

把所有的CSS文件都放入一個(gè)樣式表中,通過把所有的腳本放到一個(gè)文件中來減少HTTP請求的方法。js文件也采用同樣的方法。把所有的背景圖像都放到一個(gè)圖片文件中,然后通過CSS的background-image和background-position屬性來顯示圖片的不同部分。

14:你對前端界面工程師這個(gè)職位是怎么樣理解的?它的前景會怎么樣?

前端界面工程師:1. 與交互設(shè)計(jì)師、視覺設(shè)計(jì)師協(xié)作,根據(jù)設(shè)計(jì)圖完成頁面制作。 2. 維護(hù)及優(yōu)化網(wǎng)站前端性能。

前景: 長期以來,國內(nèi)前端開發(fā)在整個(gè)軟件開發(fā)行業(yè)內(nèi)占得比重較小,發(fā)展較晚。網(wǎng)站也多傾向于贏利最大化而輕視用戶體驗(yàn)。前后端比例懸殊大。近幾年來,隨著 以用戶為中心 的思想普及發(fā)展。前端開發(fā)呈現(xiàn)出強(qiáng)勁的發(fā)展態(tài)勢,前端開發(fā)人員在項(xiàng)目中的重要性日益突出。前端開發(fā)人員呈現(xiàn)出嚴(yán)重的人員短缺現(xiàn)象。

[Javascript]

1:js是什么,js和html的開發(fā)如何結(jié)合?

js是一種基于對象和事件驅(qū)動,并具有安全性的腳本語言。

可以html的三個(gè)地方編寫js腳本語言:一是在網(wǎng)頁文件的標(biāo)簽對中直接編寫腳本程序代碼;二是將腳本程序代碼放置在一個(gè)單獨(dú)的文件中,在網(wǎng)頁文件中引用這個(gè)腳本程序語言;三是將腳本程序代碼作為某個(gè)元素的事件屬性值或超鏈接的href屬性值。

div{margin: 0;padding: 0;border:1px red solid;}

2.怎樣添加、移除、移動、復(fù)制、創(chuàng)建和查找節(jié)點(diǎn)

添加:append

刪除:remove

移動:

復(fù)制:

創(chuàng)建:create

查找:

(1)創(chuàng)建新節(jié)點(diǎn)

createDocumentFragment()? ? //創(chuàng)建一個(gè)DOM片段

createElement_x_x()? //創(chuàng)建一個(gè)具體的元素

createTextNode()? //創(chuàng)建一個(gè)文本節(jié)點(diǎn)

(2)添加、移除、替換、插入

a()

removeChild()

replaceChild()

insertBefore()

(3)查找

getElementsByTagName_r()? ? //通過標(biāo)簽名稱

getElementsByName()? ? //通過元素的Name屬性的值

getElementById()? ? //通過元素Id,唯一性

3.怎樣使用事件以及IE和DOM事件模型之間存在哪些主要差別

4.面向?qū)ο缶幊?b怎么繼承a

5.看看下面alert的結(jié)果是什么

view sourceprint?1.function b(x, y, a) {

.arguments[2] = 10;

.alert(a);

}

b(1, 2, 3);

如果函數(shù)體改成下面,結(jié)果又會是什么?

a = 10;

alert(arguments[2] );

6.請編寫一個(gè)JavaScript函數(shù) parseQueryString,它的用途是把URL參數(shù)解析為一個(gè)對象

var obj = parseQueryString(url);

alert(obj.key0) // 輸出0

7.ajax是什么? ajax的交互模型? 同步和異步的區(qū)別? 如何解決跨域問題?

8.什么是閉包?下面這個(gè)ul,如何點(diǎn)擊每一列的時(shí)候alert其index?

這是第一條這是第二條這是第三條

閉包是可以包含自由(未綁定)變量的代碼塊;這些變量不是在這個(gè)代碼塊或者任何全局上下文中定義的,而是在定義代碼塊的環(huán)境中定義。

9.最近看的一篇Javascript的文章是?

10.常使用的庫有哪些?常用的前端開發(fā)工具?開發(fā)過什么應(yīng)用或組件?

最常用的庫:jquery-1.4.2.min.js

常用的前端開發(fā)工具:firebug、photoshop、editplus、取色器、色板、eclipse

11.說說YSlow(可以詳細(xì)一點(diǎn))

yslow是一個(gè)工具,也可以理解成是一個(gè)插件,是基于Mozilla Firefox上firebug插件的一個(gè)插件。它的出現(xiàn)的主要目的就是檢測我們的頁面性能。它讓用戶可以就近取得所需的內(nèi)容,解決網(wǎng)絡(luò)擁擠的狀況,提高用戶訪問網(wǎng)站的響應(yīng)速度;其次,yahoo在ETags配置上也有獨(dú)特之處,聲明過期,就是說,用戶從服務(wù)器取數(shù)據(jù)的時(shí)候,如果文件變化了,給他反饋新的文件,如果文件沒有變化,只需告訴客戶端沒有變化即可,不必再把文件取回來,這樣就節(jié)省了大量的網(wǎng)絡(luò)帶寬和資源。另外,只要將那些在加載過程中要執(zhí)行的腳本放到底部,就可以實(shí)現(xiàn)最大的下載并行。

小說網(wǎng)對其評價(jià):(a) 從樣式表著手,避免CSS表達(dá)式。CSS表達(dá)式需要很多資源,有時(shí)甚至?xí)斐身撁婕偎馈?b) 緩存一下不常修改的文件,并開啟 GZIP壓縮,減少網(wǎng)絡(luò)傳輸時(shí)間(c) 減少DNS查找。YSlow認(rèn)為一個(gè)頁面上2個(gè)以內(nèi)的域名比較合理。有些網(wǎng)站掛了不少統(tǒng)計(jì)代碼,或者廣告代碼。統(tǒng)計(jì)拖累用戶速度、廣告影響用戶視覺。(d) 避免重定向(跳轉(zhuǎn)),我們在給鏈接地址的時(shí)候,一般會把鏈接地址寫成 http://xxx.cn/xxx 或者 http://xxx.cn/xxx/ ,有區(qū)別嗎?有!服務(wù)器如果接收到的URL是http://xxx.cn/xxx,它會自動重定向到http://xxx.cn/xxx/,雖然進(jìn)入的都 是同一個(gè)頁面,但是前者比后者多走了一步,重定向,顯然多多少少浪費(fèi)了一點(diǎn)時(shí)間。

Google 對其評價(jià):多數(shù)人可能認(rèn)為GOOGLE沒什么值得借鑒的,畢竟整站就那么幾行代碼。

但是這幾行代碼,每天要承受過億的用戶訪問量,在如此大的壓力下,運(yùn)行流暢,有很大一個(gè)因素取決于Minify JS。通過查看它的源代碼可以發(fā)現(xiàn),google不僅將JS進(jìn)行了壓縮,連頁面代碼中也沒有不必要的空格和符號,使用了最短最簡潔的變量名。聯(lián)系到開發(fā)方 面,建議大家采用yuicompressor,在調(diào)試時(shí)使用便于開發(fā)的模式,調(diào)試完成后直接壓縮并發(fā)布。讓用戶得到最快捷的用戶體驗(yàn)。

百度:

1、JavaScript有哪幾種數(shù)據(jù)類型

2、中alt和tittle的區(qū)別

3、下面css標(biāo)簽在JavaScript中調(diào)用應(yīng)如何拼寫,border-left-color,-moz-

4、動態(tài)打印 yyyy-mm-dd hh:mm:ss

5、如何提高網(wǎng)頁的運(yùn)行速度

6、JavaScript中如何對一個(gè)對象進(jìn)行深度clone

7、flash中ActionScript2.0和ActionScript3.0面向?qū)ο蟮漠愅?/p>

答案見http://www.lihaihong.com/article/86.html

第一題

編寫一個(gè)方法 求一個(gè)字符串的字節(jié)長度

第二題

如何控制alert中的換行

第三題

解釋document.getElementByIdx_x_x_x(“ElementID”).style.fontSize=”1.5em”

第四題

將一個(gè)類似圖中的效果分離成css和html

第五題

按照格式 xxxx年xx月xx日xx時(shí)xx分xx秒動態(tài)顯示時(shí)間 要求不足10的補(bǔ)0

第六題

編寫一個(gè)方法 去掉一個(gè)數(shù)組的重復(fù)元素

第七題

說出3條以上ff和ie的腳本兼容問題

第八題

按要求寫一個(gè)簡單的ajax示例 簡單的沒意義 就不寫了

騰訊:

1.請實(shí)現(xiàn),鼠標(biāo)點(diǎn)擊頁面中的任意標(biāo)簽,alert該標(biāo)簽的名稱.(注意兼容性)

HTML && CSS

1.Doctype? 嚴(yán)格模式與混雜模式-如何觸發(fā)這兩種模式,區(qū)分它們有何意義? 行內(nèi)元素有哪些?塊級元素有哪些?CSS的盒模型?

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

3.CSS選擇符有哪些?哪些屬性可以繼承?優(yōu)先級?內(nèi)聯(lián)和important哪個(gè)優(yōu)先級高?

4.經(jīng)常遇到的瀏覽器的兼容性有哪些?怎么會出現(xiàn)?解決方法是什么?

5.如何居中一個(gè)浮動元素?

6.HTML5和CSS3的了解情況

7.你怎么來實(shí)現(xiàn)下面這個(gè)設(shè)計(jì)圖

Javascript

1.怎樣添加、移除、移動、復(fù)制、創(chuàng)建和查找節(jié)點(diǎn)

(1)創(chuàng)建新節(jié)點(diǎn)

createDocumentFragment()? ? //創(chuàng)建一個(gè)DOM片段

createElement_x_x()? //創(chuàng)建一個(gè)具體的元素

createTextNode()? //創(chuàng)建一個(gè)文本節(jié)點(diǎn)

(2)添加、移除、替換、插入

a()

removeChild()

replaceChild()

insertBefore()

(3)查找

getElementsByTagName_r()? ? //通過標(biāo)簽名稱

getElementsByName()? ? //通過元素的Name屬性的值

getElementById()? ? //通過元素Id,唯一性

2.怎樣使用事件以及IE和DOM事件模型之間存在哪些主要差別

3.面向?qū)ο缶幊?b怎么繼承a

4.看看下面alert的結(jié)果是什么

function b(x, y, a) {

arguments[2] = 10;

alert(a);

}

b(1, 2, 3);

如果函數(shù)體改成下面,結(jié)果又會是什么?

a = 10;

alert(arguments[2] );

5.請編寫一個(gè)JavaScript函數(shù) parseQueryString,它的用途是把URL參數(shù)解析為一個(gè)對象,如:var url = ”http://www.taobao.com/index.php?key0=0&key1=1& key2=2…..”

var obj = parseQueryString(url);

alert(obj.key0) // 輸出0

(來自淘寶網(wǎng)校園招聘筆試題)

6.ajax是什么? ajax的交互模型? 同步和異步的區(qū)別? 如何解決跨域問題?

7.什么是閉包?下面這個(gè)ul,如何點(diǎn)擊每一列的時(shí)候alert其index?

這是第一條這是第二條這是第三條

8.最近看的一篇Javascript的文章

9.你如何去實(shí)現(xiàn)這個(gè)Tabview

10.常使用的庫有哪些?常用的前端開發(fā)工具?開發(fā)過什么應(yīng)用或組件?

11.性能-Yslow

[HTML && CSS]

1.Doctype? 嚴(yán)格模式與混雜模式-如何觸發(fā)這兩種模式,區(qū)分它們有何意義?

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

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

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

5:前端頁面有哪三層構(gòu)成,分別是什么?作用是什么?

6:css的基本語句構(gòu)成是?

8:你做的頁面在哪些流覽器測試過?這些瀏覽器的內(nèi)核分別是什么?經(jīng)常遇到的瀏覽器的兼容性有哪些?怎么會出現(xiàn)?解決方法是什么?

9.如何居中一個(gè)浮動元素?

10.有沒有關(guān)注HTML5和CSS3?如有請簡單說一些您對它們的了解情況!

11.你怎么來實(shí)現(xiàn)下面這個(gè)設(shè)計(jì)圖,主要講述思路 (效果圖省略)

13:如果讓你來制作一個(gè)訪問量很高的大型網(wǎng)站,你會如何來管理所有CSS文件、JS與圖片?

14:你對前端界面工程師這個(gè)職位是怎么樣理解的?它的前景會怎么樣?

重申一下,上述這些知識點(diǎn)都應(yīng)該是你應(yīng)該“想都不用想”的東西。我一開始問的所有問題都是想摸清你對所有這些領(lǐng)域知識的掌握程度。雖然上面列出的這些知識點(diǎn)并沒有面面俱到,但我覺得你至少應(yīng)該掌握這些,才有可能跟我坐到一間辦公室里來。

少量提問

我非常贊同面試者問的問題越少越好。反復(fù)問應(yīng)聘者各種問題既不公平,也很無聊。我在任何一次面試中,通常只問三個(gè)大問題,但每個(gè)問題又會涉及我所能想到的多個(gè)方面。回答每個(gè)大問題一般要經(jīng)過幾個(gè)步驟,這樣我就可以在每個(gè)步驟中穿插著問一些小問題。比如說:

現(xiàn)在有一個(gè)正顯示著Yahoo!股票價(jià)格的頁面。頁面上有一個(gè)按鈕,你可以單擊它來刷新價(jià)格,但不會重新加載頁面。請你描述一下實(shí)現(xiàn)這個(gè)功能的過程,假設(shè)服務(wù)器會負(fù)責(zé)準(zhǔn)備好正確的股票價(jià)格數(shù)據(jù)。

這個(gè)問題牽扯到一組我想要考察的基本知識點(diǎn):DOM結(jié)構(gòu)、DOM操作、事件處理、XHR和JSON。如果我要求你對換一種處理股票價(jià)格的方式,或者讓你在頁面中顯示其他信息,就可以把更多的知識點(diǎn)包括進(jìn)來。對于經(jīng)驗(yàn)比較豐富應(yīng)聘者,我也可以自如地?cái)U(kuò)展要考察的知識范圍,最簡單像JOSN與XML的區(qū)別、安全問題、容量問題,等等。

我還希望應(yīng)聘者給出的任何解決方案中都不要使用庫。我想看到最原生態(tài)的代碼,你就當(dāng)頁面中沒有包含任何庫。你說你對哪個(gè)庫了解多少多少,但我不能把關(guān)于庫的知識作為評判能力的因素,因?yàn)閹焓菚S時(shí)間變化的。我需要的是真正理解庫背后的機(jī)制,特別是能夠徒手寫出一個(gè)自己的庫的人。

解決問題

做為一名前端工程師,最值得高興的事莫過于解決同一個(gè)問題會有很多種不同的方法,而你要做的就是找出最合適的方法來。我在提問的時(shí)候,經(jīng)常會在應(yīng)聘者解釋完一種方法后問他們還有沒有第二種方法。此時(shí)我會跟他們說,假設(shè)你的這個(gè)方法由于種種原因被否決了,那么你還能不能給出另一種方法。這樣做可以達(dá)到兩個(gè)目的。

首先,可以測試出他們是否在毫無意義地復(fù)述書本中的東西。不能不承認(rèn),某些人確實(shí)有過目不忘的天賦,聽他們在那里滔滔不絕地講,你會覺得他們什么都明白。可是,只要一跟這些人談到怎么查找方案無效的原因,以及能否拿出一個(gè)新方案來,他們往往就傻眼了。這時(shí)候,如果我聽到“我不明白這個(gè)方案為什么不夠好”之類的反問,心里立刻就明白我的問題已經(jīng)超出了他們的能力范圍,而他們只是想拿自己死記硬背的結(jié)論來蒙混過關(guān)。

其次,可以測試出他們已經(jīng)掌握的(還是那句話,“想都不用想”)瀏覽器技術(shù)知識。如果他們對瀏覽器平臺的核心知識有較好的理解,想出解決同一問題的不同方案根本沒有那么難。

對一名前端工程師來說,這絕對是最重要的能力。前端工程師在工作中遇到本該如此卻并未如此的難題(說你啦,IE6),應(yīng)該說是一件很平常的事。一個(gè)方案無效就無計(jì)可施的人,做不了前端工程師。

考核應(yīng)聘者解決問題能力的另一層原因,與我的個(gè)人喜好有關(guān)。在搞清楚應(yīng)聘者知道什么不知道什么之后,我就會想著問一個(gè)他們知識領(lǐng)域之外的問題。這樣做的目的,就是想看看他們怎樣運(yùn)用已有的知識解決新問題。在解決問題的每一步,我也準(zhǔn)備了一些提示,以防有人會卡殼打艮(在我面前15分鐘一言不發(fā),對我評價(jià)這個(gè)人毫無幫助)。我真正感興趣的,是他們能夠從上一步前進(jìn)到下一步。我希望看到一個(gè)人就在我眼前學(xué)到新知識。

注意:所有問題都與瀏覽器技術(shù)相關(guān)。我不相信出幾道抽象的邏輯題,就能夠考出某人解決Web技術(shù)問題的能力。在我看來,這無異于讓素描大師畫肖像(或者讓劉翔跟博爾特同場競技),沒有意義,也得不到任何有價(jià)值的信息。

有激情

要成為一名優(yōu)秀的前端工程師,最重要的莫過于對自己做的事要有激情。我們技能都不是從學(xué)校中或者從研討會上學(xué)來的,因此前端工程師必須具備自學(xué)能力。瀏覽器技術(shù)的變化可謂日新月異,所以也只有不斷提升自己的技能才做得到與時(shí)俱進(jìn)。我雖然不能強(qiáng)迫誰必須多看博客、不斷學(xué)習(xí),但想應(yīng)聘前端工程師的人恐怕還是必須這么做的。

你怎么知道誰對這種工作有沒有激情?實(shí)際上非常簡單。我只問一個(gè)簡單的問題:“目前你對什么Web技術(shù)最感興趣?”這個(gè)問題永遠(yuǎn)不會過期,而且也幾乎不可能出錯……除非你答不上來。就眼下來說,我希望你對這個(gè)問題給出的技術(shù)中包括WebSocket、HTML、WebGL、客戶端數(shù)據(jù)庫,等等。只有對Web開發(fā)充滿激情的人,才會堅(jiān)持不懈地學(xué)習(xí)新知識、掌握新技能;這些人才是我真正想要的。當(dāng)然,我會讓他們詳細(xì)解釋自己提到的技術(shù),以保證他們不是隨口說了幾個(gè)時(shí)髦的新詞匯。

最后一點(diǎn)

計(jì)算機(jī)科學(xué)或者Web設(shè)計(jì)方面的知識當(dāng)然也有用,但那都是基本知識之外的東西。只要基本知識在那兒了,一切就都有了基礎(chǔ),想擴(kuò)充知識面也不難。可是,如果等到正式上班以后,還得從頭學(xué)習(xí)基本技能,那種難度是不可同日而語的。另外,高級前端工程師與一般工程師相比,肯定需要掌握更多的技能。而面試幾乎沒有經(jīng)驗(yàn)大學(xué)畢業(yè)生,同樣也會有一套完全不同的程序。我在這篇文章里列出來的都是一些最基本的東西。

對于那些還沒有多少面試經(jīng)驗(yàn)的人,我總是喜歡告訴他們,面試完了只要問自己一個(gè)問題就行:你想以后跟這個(gè)人在一起共事嗎?如果不管為什么,回答是不,那就是不。

面試前端工程師對我來說是一件非常有意思的事,因?yàn)槊嬖囘^程很大程度上也是自我提升的過程。無論大公司還是小公司,之所以在如何招聘到真正有能力的前端工程師方面會遇到同樣的問題,就是因?yàn)樨?fù)責(zé)招聘的那些人不知道自己公司需要什么樣的人,結(jié)果問問題時(shí)也問不到點(diǎn)子上。經(jīng)過這幾年在行業(yè)里的摸索,我總結(jié)出了自己的一套很有效的面試前端工程的方法。

有的應(yīng)聘者說我不好對付,但留給他們這樣的印象也并非我所愿。我覺得之所以他們說我不好對付,主要是因?yàn)槲覇査麄儐栴}時(shí)問得太細(xì)了。以前我曾專門寫過一些東西,告訴應(yīng)聘者怎么才能通過我的面試(Surviving an interview with me)以及優(yōu)秀的前面工程師應(yīng)該具備什么樣的素質(zhì)(What makes a good front end engineer?),而我的面試可以說完全是按照那兩篇文章的標(biāo)準(zhǔn)進(jìn)行的。我不會問一些特別偏門的問題,也不認(rèn)為出幾道邏輯題就能考出人的真實(shí)水平。我唯一的想法就是確定你能否勝任我們要招的這個(gè)職位。為此,我需要簡單地考察如下幾個(gè)方面。

基本知識

我們生活在互聯(lián)網(wǎng)時(shí)代,你想知道的任何事情幾乎都能在15分鐘內(nèi)找到相關(guān)信息。可是,能找到信息并不等于你會使用它。我認(rèn)為所有前端工程師至少都應(yīng)該掌握某些基本的知識,才能有效地完成自己的工作。如果一遇到問題,就停下工作上網(wǎng)四處搜索解決方案,怎么可能保證按期完成工作呢?聽聽,還有誰在說“我不知道,但我可以上網(wǎng)搜到。”請這些同學(xué)把手舉起來,讓大家認(rèn)識一下(immediately raises a flag for me.)。下面我列出一些基本的知識點(diǎn),這些都是我認(rèn)為一名前端工程師(無論工作年頭長短)在沒有任何外來幫助的情況應(yīng)該知道的。

DOM結(jié)構(gòu)——兩個(gè)節(jié)點(diǎn)之間可能存在哪些關(guān)系以及如何在節(jié)點(diǎn)之間任意移動。

DOM操作——怎樣添加、移除、移動、復(fù)制、創(chuàng)建和查找節(jié)點(diǎn)。

事件——怎樣使用事件以及IE和DOM事件模型之間存在哪些主要差別。

XMLHttpRequest——這是什么、怎樣完整地執(zhí)行一次GET請求、怎樣檢測錯誤。

嚴(yán)格模式與混雜模式——如何觸發(fā)這兩種模式,區(qū)分它們有何意義。

盒模型——外邊距、內(nèi)邊距和邊框之間的關(guān)系,IE 8以下版本的瀏覽器中的盒模型有什么不同。

塊級元素與行內(nèi)元素——怎么用CSS控制它們、它們怎樣影響周圍的元素以及你覺得應(yīng)該如何定義它們的樣式。

浮動元素——怎么使用它們、它們有什么問題以及怎么解決這些問題。

HTML與XHTML——二者有什么區(qū)別,你覺得應(yīng)該使用哪一個(gè)并說出理由。

JSON——它是什么、為什么應(yīng)該使用它、到底該怎么使用它,說出實(shí)現(xiàn)細(xì)節(jié)來。

重申一下,上述這些知識點(diǎn)都應(yīng)該是你應(yīng)該“想都不用想”的東西。我一開始問的所有問題都是想摸清你對所有這些領(lǐng)域知識的掌握程度。雖然上面列出的這些知識點(diǎn)并沒有面面俱到,但我覺得你至少應(yīng)該掌握這些,才有可能跟我坐到一間辦公室里來。

少量提問

我非常贊同面試者問的問題越少越好。反復(fù)問應(yīng)聘者各種問題既不公平,也很無聊。我在任何一次面試中,通常只問三個(gè)大問題,但每個(gè)問題又會涉及我所能想到的多個(gè)方面。回答每個(gè)大問題一般要經(jīng)過幾個(gè)步驟,這樣我就可以在每個(gè)步驟中穿插著問一些小問題。比如說:

現(xiàn)在有一個(gè)正顯示著Yahoo!股票價(jià)格的頁面。頁面上有一個(gè)按鈕,你可以單擊它來刷新價(jià)格,但不會重新加載頁面。請你描述一下實(shí)現(xiàn)這個(gè)功能的過程,假設(shè)服務(wù)器會負(fù)責(zé)準(zhǔn)備好正確的股票價(jià)格數(shù)據(jù)。

這個(gè)問題牽扯到一組我想要考察的基本知識點(diǎn):DOM結(jié)構(gòu)、DOM操作、事件處理、XHR和JSON。如果我要求你對換一種處理股票價(jià)格的方式,或者讓你在頁面中顯示其他信息,就可以把更多的知識點(diǎn)包括進(jìn)來。對于經(jīng)驗(yàn)比較豐富應(yīng)聘者,我也可以自如地?cái)U(kuò)展要考察的知識范圍,最簡單像JOSN與XML的區(qū)別、安全問題、容量問題,等等。

我還希望應(yīng)聘者給出的任何解決方案中都不要使用庫。我想看到最原生態(tài)的代碼,你就當(dāng)頁面中沒有包含任何庫。你說你對哪個(gè)庫了解多少多少,但我不能把關(guān)于庫的知識作為評判能力的因素,因?yàn)閹焓菚S時(shí)間變化的。我需要的是真正理解庫背后的機(jī)制,特別是能夠徒手寫出一個(gè)自己的庫的人。

解決問題

做為一名前端工程師,最值得高興的事莫過于解決同一個(gè)問題會有很多種不同的方法,而你要做的就是找出最合適的方法來。我在提問的時(shí)候,經(jīng)常會在應(yīng)聘者解釋完一種方法后問他們還有沒有第二種方法。此時(shí)我會跟他們說,假設(shè)你的這個(gè)方法由于種種原因被否決了,那么你還能不能給出另一種方法。這樣做可以達(dá)到兩個(gè)目的。

首先,可以測試出他們是否在毫無意義地復(fù)述書本中的東西。不能不承認(rèn),某些人確實(shí)有過目不忘的天賦,聽他們在那里滔滔不絕地講,你會覺得他們什么都明白。可是,只要一跟這些人談到怎么查找方案無效的原因,以及能否拿出一個(gè)新方案來,他們往往就傻眼了。這時(shí)候,如果我聽到“我不明白這個(gè)方案為什么不夠好”之類的反問,心里立刻就明白我的問題已經(jīng)超出了他們的能力范圍,而他們只是想拿自己死記硬背的結(jié)論來蒙混過關(guān)。

其次,可以測試出他們已經(jīng)掌握的(還是那句話,“想都不用想”)瀏覽器技術(shù)知識。如果他們對瀏覽器平臺的核心知識有較好的理解,想出解決同一問題的不同方案根本沒有那么難。

對一名前端工程師來說,這絕對是最重要的能力。前端工程師在工作中遇到本該如此卻并未如此的難題(說你啦,IE6),應(yīng)該說是一件很平常的事。一個(gè)方案無效就無計(jì)可施的人,做不了前端工程師。

考核應(yīng)聘者解決問題能力的另一層原因,與我的個(gè)人喜好有關(guān)。在搞清楚應(yīng)聘者知道什么不知道什么之后,我就會想著問一個(gè)他們知識領(lǐng)域之外的問題。這樣做的目的,就是想看看他們怎樣運(yùn)用已有的知識解決新問題。在解決問題的每一步,我也準(zhǔn)備了一些提示,以防有人會卡殼打艮(在我面前15分鐘一言不發(fā),對我評價(jià)這個(gè)人毫無幫助)。我真正感興趣的,是他們能夠從上一步前進(jìn)到下一步。我希望看到一個(gè)人就在我眼前學(xué)到新知識。

注意:所有問題都與瀏覽器技術(shù)相關(guān)。我不相信出幾道抽象的邏輯題,就能夠考出某人解決Web技術(shù)問題的能力。在我看來,這無異于讓素描大師畫肖像(或者讓劉翔跟博爾特同場競技),沒有意義,也得不到任何有價(jià)值的信息。

有激情

要成為一名優(yōu)秀的前端工程師,最重要的莫過于對自己做的事要有激情。我們技能都不是從學(xué)校中或者從研討會上學(xué)來的,因此前端工程師必須具備自學(xué)能力。瀏覽器技術(shù)的變化可謂日新月異,所以也只有不斷提升自己的技能才做得到與時(shí)俱進(jìn)。我雖然不能強(qiáng)迫誰必須多看博客、不斷學(xué)習(xí),但想應(yīng)聘前端工程師的人恐怕還是必須這么做的。

你怎么知道誰對這種工作有沒有激情?實(shí)際上非常簡單。我只問一個(gè)簡單的問題:“目前你對什么Web技術(shù)最感興趣?”這個(gè)問題永遠(yuǎn)不會過期,而且也幾乎不可能出錯……除非你答不上來。就眼下來說,我希望你對這個(gè)問題給出的技術(shù)中包括WebSocket、HTML、WebGL、客戶端數(shù)據(jù)庫,等等。只有對Web開發(fā)充滿激情的人,才會堅(jiān)持不懈地學(xué)習(xí)新知識、掌握新技能;這些人才是我真正想要的。當(dāng)然,我會讓他們詳細(xì)解釋自己提到的技術(shù),以保證他們不是隨口說了幾個(gè)時(shí)髦的新詞匯。

最后一點(diǎn)

計(jì)算機(jī)科學(xué)或者Web設(shè)計(jì)方面的知識當(dāng)然也有用,但那都是基本知識之外的東西。只要基本知識在那兒了,一切就都有了基礎(chǔ),想擴(kuò)充知識面也不難。可是,如果等到正式上班以后,還得從頭學(xué)習(xí)基本技能,那種難度是不可同日而語的。另外,高級前端工程師與一般工程師相比,肯定需要掌握更多的技能。而面試幾乎沒有經(jīng)驗(yàn)大學(xué)畢業(yè)生,同樣也會有一套完全不同的程序。我在這篇文章里列出來的都是一些最基本的東西。

對于那些還沒有多少面試經(jīng)驗(yàn)的人,我總是喜歡告訴他們,面試完了只要問自己一個(gè)問題就行:你想以后跟這個(gè)人在一起共事嗎?如果不管為什么,回答是不,那就是不。

前端開發(fā)工程師面試題 Javascript

1. 要動態(tài)改變層中內(nèi)容可以使用的方法有(AB )

a)innerHTML

b)innerText

c)通過設(shè)置層的隱藏和顯示來實(shí)現(xiàn)

d)通過設(shè)置層的樣式屬性的display屬性

2. 當(dāng)按鍵盤A時(shí),使用onKeyDown事件打印event.keyCode的結(jié)果是(A )

a)65

b)13

c)97

d)37

3. 在javascript里,下列選項(xiàng)中不屬于數(shù)組方法的是(B);

a)sort()

b)length()

c)concat()

d)reverse()

4. 下列哪一個(gè)選項(xiàng)可以用來檢索被選定的選項(xiàng)的索引號?(B)

a)disabled

b)selectedIndex

c)option

d)multiple

5. 希望圖片具有”提交”按鈕同樣的功能,該如何編寫表單提交?(A )

a)在圖片的onClick事件中手動提交

b)在圖片上添加onSubmit事件

c)在圖片的onSubmit事件中手動提交

d)在表單中自動提交

6. 使div層和文本框處在同一行的代碼正確的是(D );

a)

b)

c)

d)

7. 下列選項(xiàng)中,描述正確的是(選擇兩項(xiàng)) 。( AD )

a)options.add(new Option(‘a(chǎn)’,'A’))可以動態(tài)添加一個(gè)下拉列表選項(xiàng)

b)option.add(new Option(‘a(chǎn)’,'A’))可以動態(tài)添加一個(gè)下拉列表選項(xiàng)

c)new Option(‘a(chǎn)’,'A’)中’a'表示列表選項(xiàng)的值,’A'用于在頁面中顯示

d)new Option(‘a(chǎn)’,'A’)中’A'表示列表選項(xiàng)的值,’a'用于在頁面中顯示

8. 、 var emp = new Array(3);

for(var i in emp)

以下答案中能與for循環(huán)代碼互換的是: (選擇一項(xiàng))。(D )

A for(var i =0; i

B for(var i =0; i

C for(var i =0; i

D for(var i =0; i

9. 制作級聯(lián)菜單功能時(shí)調(diào)用的是下拉列表框的(A )事件。

a)onChange

b)onFocus

c)selected

d)onClick

10. 下列聲明數(shù)組的語句中,錯誤的選項(xiàng)是( C )。

a)Var arry= new Array()

b)Var arry=new Array(3)

c)Var arry[]=new Array(3)(4)

d)Var arry=new Array(‘3’,’4’)

11. 下列屬性哪一個(gè)能夠?qū)崿F(xiàn)層的隱藏?(C )

a)display:fals

b)display:hidden

c)display:none

d)display:” ”

12. 下列哪一個(gè)選項(xiàng)不屬于document對象的方法?(D )

a)focus()

b)getElementById()

c)getElementsByName()

d)bgColor()

13. 下列哪項(xiàng)是按下鍵盤事件(AB )

a)onKeyDown

b)onKeyPress

c)keyCode

d)onMouseOver

14. javascript進(jìn)行表單驗(yàn)證的目的是(B )

a)把用戶的正確信息提交給服務(wù)器

b)檢查提交的數(shù)據(jù)必須符合實(shí)際

c)使得頁面變得美觀、大方

d)減輕服務(wù)器端的壓力

15. 、 display屬性值的常用取值不包括(C )

a)inline

b)block

c)hidden

d)none

16. 以下有關(guān)pixelTop屬性與top屬性的說法正確的是。(D )

a)都是Location對象的屬性

b)使用時(shí)返回值都是字符串

c)都是返回以像素為單位的數(shù)值

d)以上都不對

17. 使用open方法打開具有瀏覽器工具條,地址欄,菜單欄的窗口,下列選項(xiàng)正確的是__D__

a)open("x.html","HI","toolbas=1,scrollbars=1,status=1");

b)open("HI","scrollbars=1,location=1,status=1");

c)open("x.html","status=yes,menubar=1,location=1");

d)open("x.html","HI","toolbas=yes,menubar=1,location=1");

18. 下面關(guān)閉名為mydiv的層的代碼正確的是(C )

a)document.getElementByIdx_x_x_x(mydiv).style.display="none";

b)document.getElementByIdx_x_x_x("mydiv").style.display=none;

c)document.getElementByIdx_x_x_x("mydiv").style.display="none";

d)document.getElementByIdx_x_x_x("mydiv").style.display=="none";

19. 為什么要使用Div+CSS布局

形式與內(nèi)容分離

大大減少頁面代碼,提高頁面瀏覽速度

結(jié)構(gòu)清晰,有利于SEO

縮短改版時(shí)間, 布局更方便

一次設(shè)計(jì),多次使用

20. Block元素的特點(diǎn)是什么?哪些元素默認(rèn)為Block元素

總是在新行上開始;

高度,行高以及頂和底邊距都可控制;

寬度缺省是它的容器的100%,除非設(shè)定一個(gè)寬度

是塊元素的有:,,

,

, 和21. 、 inline元素的特點(diǎn)是什么?哪些元素屬于inline元素?

和其他元素都在一行上;

高,行高及頂和底邊距不可改變;

寬度就是它的文字或圖片的寬度,不可改變。

是inline元素的有:, , ,

, ,

和。

22. 、 javascript中表達(dá)式parseInt(“X8X8”)+paseFloat(‘8’)的結(jié)果是什么?( C)

a)8+8

b)88

c)16

d)“8”+’8

23. String對象的方法不包括(C )

a)charAt();

b)substring()

c)length

d)toUpperCase()

24. 關(guān)于setTimeout(“check”,10)中說法正確的是( D)

a)程序循環(huán)執(zhí)行10次

b)Check函數(shù)每10秒執(zhí)行一次

c)10做為參數(shù)傳給函數(shù)check

d)Check函數(shù)每10毫秒執(zhí)行一次

25. 以下哪個(gè)單詞不屬于javascript關(guān)鍵字:(C)

a)with

b)parent

c)class

d)void

前言

本文總結(jié)了一些優(yōu)質(zhì)的前端面試題(多數(shù)源于網(wǎng)絡(luò)),初學(xué)者閱后也要用心鉆研其中的原理,重要知識需要系統(tǒng)學(xué)習(xí),透徹學(xué)習(xí),形成自己的知識鏈。萬不可投機(jī)取巧,只求面試過關(guān)是錯誤的!

面試有幾點(diǎn)需注意:(來源程劭非老師 github:@wintercn)

面試題目: 根據(jù)你的等級和職位變化,入門級到專家級:范圍↑、深度↑、方向↑。

題目類型: 技術(shù)視野、項(xiàng)目細(xì)節(jié)、理論知識題,算法題,開放性題,案例題。

進(jìn)行追問: 可以確保問到你開始不懂或面試官開始不懂為止,這樣可以大大延展題目的區(qū)分度和深度,知道你的實(shí)際能力。因?yàn)檫@種關(guān)聯(lián)知識是長時(shí)期的學(xué)習(xí),絕對不是臨時(shí)記得住的。

回答問題再棒,面試官(可能是你的直接領(lǐng)導(dǎo)面試),會考慮我要不要這個(gè)人做我的同事?所以態(tài)度很重要。(感覺更像是相親)

資深的工程師能把 absolute 和 relative 弄混,這樣的人不要也罷,因?yàn)閳F(tuán)隊(duì)需要的你這個(gè)人具有可以依靠的才能(靠譜)。

前端開發(fā)面試知識點(diǎn)大綱:

HTML&CSS:? ? 對Web標(biāo)準(zhǔn)的理解、瀏覽器內(nèi)核差異、兼容性、hack、CSS基本功:布局、盒子模型、選擇器優(yōu)先級及使用、HTML5CSS3、移動端適應(yīng) JavaScript:? ? ? 數(shù)據(jù)類型、面向?qū)ο蟆⒗^承、閉包、插件、作用域、跨域、原型鏈、模塊化、自定義事件、內(nèi)存泄漏、事件機(jī)制、異步裝載回調(diào)、模板引擎、Nodejs、JSON、ajax等。其他:? HTTP、安全、正則、優(yōu)化、重構(gòu)、響應(yīng)式、移動端、團(tuán)隊(duì)協(xié)作、可維護(hù)、SEO、UED、架構(gòu)、職業(yè)生涯

作為一名前端工程師,無論工作年頭長短都應(yīng)該必須掌握的知識點(diǎn):

此條由 王子墨 發(fā)表在前端隨筆

1、DOM結(jié)構(gòu) —— 兩個(gè)節(jié)點(diǎn)之間可能存在哪些關(guān)系以及如何在節(jié)點(diǎn)之間任意移動。? ? 2、DOM操作? ——如何添加、移除、移動、復(fù)制、創(chuàng)建和查找節(jié)點(diǎn)等。? ? 3、事件? ? —— 如何使用事件,以及IE和標(biāo)準(zhǔn)DOM事件模型之間存在的差別。? ? 4、XMLHttpRequest —— 這是什么、怎樣完整地執(zhí)行一次GET請求、怎樣檢測錯誤。? ? 5、嚴(yán)格模式與混雜模式 —— 如何觸發(fā)這兩種模式,區(qū)分它們有何意義。? ? 6、盒模型 —— 外邊距、內(nèi)邊距和邊框之間的關(guān)系,及IE8以下版本的瀏覽器中的盒模型? ? 7、塊級元素與行內(nèi)元素 —— 怎么用CSS控制它們、以及如何合理的使用它們? ? 8、浮動元素——怎么使用它們、它們有什么問題以及怎么解決這些問題。? ? 9、HTML與XHTML——二者有什么區(qū)別,你覺得應(yīng)該使用哪一個(gè)并說出理由。? ? 10、JSON? —— 作用、用途、設(shè)計(jì)結(jié)構(gòu)。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 228,443評論 6 532
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 98,530評論 3 416
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 176,407評論 0 375
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經(jīng)常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 62,981評論 1 312
  • 正文 為了忘掉前任,我火速辦了婚禮,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 71,759評論 6 410
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 55,204評論 1 324
  • 那天,我揣著相機(jī)與錄音,去河邊找鬼。 笑死,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,263評論 3 441
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 42,415評論 0 288
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 48,955評論 1 336
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 40,782評論 3 354
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 42,983評論 1 369
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,528評論 5 359
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 44,222評論 3 347
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 34,650評論 0 26
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 35,892評論 1 286
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 51,675評論 3 392
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 47,967評論 2 374

推薦閱讀更多精彩內(nèi)容

  • <a name='html'>HTML</a> Doctype作用?標(biāo)準(zhǔn)模式與兼容模式各有什么區(qū)別? (1)、<...
    clark124閱讀 3,528評論 1 19
  • 在線閱讀 http://interview.poetries.top[http://interview.poetr...
    前端進(jìn)階之旅閱讀 114,521評論 24 450
  • HTML+CSS 1.對WEB標(biāo)準(zhǔn)以及W3C的理解與認(rèn)識 標(biāo)簽閉合、標(biāo)簽小寫、不亂嵌套、提高搜索機(jī)器人搜索幾率、使...
    aymincoder閱讀 5,085評論 2 188
  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標(biāo)簽?zāi)J(rèn)的外補(bǔ)...
    _Yfling閱讀 13,776評論 1 92
  • 請參看我github中的wiki,不定期更新。https://github.com/ivonzhang/Front...
    zhangivon閱讀 7,157評論 2 19