WEB前端開發(fā)面試題集錦

1、列舉你工作中遇到的IE6BUG，談?wù)劷鉀Q方案。3、如何用CSS分別單獨(dú)定義IE6、7、8的width屬性。所有瀏覽器通用height:100px;IE6專用_height:100px;IE6專用*height:100px;IE7專用*+height:100px;IE7、FF共用height:100px'important;4、CSS中哪些屬性可以同父元素繼承。繼承：（X）HTML元素可以從其父元素那里繼承部分CSS屬性，即使當(dāng)前元素并沒有定義該屬性Color;font-size;5、你如何理解HTML結(jié)構(gòu)的語意化。去掉或樣式丟失的時(shí)候能讓頁面呈現(xiàn)清晰的結(jié)構(gòu)：html本身是沒有表現(xiàn)的，我們看到例如＜h1＞是粗體，字體大小2em，加粗；＜strong＞是加粗的，不要認(rèn)為這是htm：這些其實(shí)html默認(rèn)的css樣式在起作用，所以去掉或樣式丟失的時(shí)候能讓頁面呈現(xiàn)清晰的結(jié)構(gòu)不是語義化的HTML點(diǎn)，但是瀏覽器都有有默認(rèn)樣式，默認(rèn)樣式的目的也是為了更好的表達(dá)html的語義，可以說瀏覽器的默認(rèn)樣式和HTML結(jié)構(gòu)是不可分割的。屏幕閱讀器（如果訪客有視障）會(huì)完全根據(jù)你的標(biāo)記來“讀”你的網(wǎng)頁.例如,如果你使用的含語義的標(biāo)記，屏幕閱讀器就會(huì)“逐個(gè)拼出”你的單詞，而不是試著去對它完整發(fā)音.PDA、手機(jī)等設(shè)備可能無法像普通電腦的瀏覽器一樣來渲染網(wǎng)頁（通常是因?yàn)檫@些設(shè)備對CSS的支持較弱）?使用語義標(biāo)記可以確保這些設(shè)備以一種有意義的方式來渲染網(wǎng)頁.理想情況下，觀看設(shè)備的任務(wù)是符合設(shè)備本身的芻染網(wǎng)頁.語義標(biāo)記為設(shè)備提供了所需的相關(guān)信息，就省去了你自己去考慮所有可能的顯示情況（包括現(xiàn)有的或者將來新的設(shè)危一部手機(jī)可以選擇使一段標(biāo)記了標(biāo)題的文字以粗體顯示.而掌上電腦可能會(huì)以比較大的字體來顯示.無論哪種方式-文本標(biāo)記為標(biāo)題，您就可以確信讀取設(shè)備將根據(jù)其自身的條件來合適地顯示頁面.搜索引擎的爬蟲也依賴于標(biāo)記來確定上下文和各個(gè)關(guān)鍵字的權(quán)重.過去你可能還沒有考慮搜索引擎的爬蟲也是網(wǎng)站的“訪客”，但現(xiàn)在它們他們實(shí)際上是極其寶貴的用戶.沒有他們白引擎將無法索引你的網(wǎng)站，然后一般用戶將很難過來訪問.你的頁面是否對爬蟲容易理解非常重要，因?yàn)榕老x很大程度上會(huì)忽略用于表現(xiàn)的標(biāo)記,而只注重語義標(biāo)記.因此,如果頁面文件的標(biāo)題被標(biāo)記，而不是,那么這個(gè)頁面在搜索結(jié)果的位置可能會(huì)比較靠后.除了提升易用性外,語利于正確使用CSS和JavaScript，因?yàn)槠浔旧硖峁┝嗽S多“鉤鉤”來應(yīng)用頁面的樣式與行為.SEO主要還是靠你網(wǎng)站的內(nèi)容和外部鏈接的。（轉(zhuǎn)載請注明出處：WEB前端開發(fā)/）便于團(tuán)隊(duì)開發(fā)和維護(hù)W3C給我們定了一個(gè)很好的標(biāo)準(zhǔn)，在團(tuán)隊(duì)中大家都遵循這個(gè)標(biāo)準(zhǔn)，可以減少很多差異化的東西，方便開發(fā)和維護(hù)，效率，甚至實(shí)現(xiàn)模塊化開發(fā)。6、談?wù)勔郧岸私嵌瘸霭l(fā)做好SEO需要考慮什么。1、了解搜索引擎如何抓取網(wǎng)頁和如何索引網(wǎng)頁你需要知道一些搜索引擎的基本工作原理，各個(gè)搜索引擎之間的區(qū)別，搜索機(jī)器人（SErobot或叫webcra何進(jìn)行工作，搜索引擎如何對搜索結(jié)果進(jìn)行排序等等。2、Meta標(biāo)簽優(yōu)化主要包括主題（Title），網(wǎng)站描述（Description），和關(guān)鍵詞（Keywords）。還有一些其它的隱藏文字比如Au者），Category（目錄），Language（編碼語種）等。3、如何選取關(guān)鍵詞并在網(wǎng)頁中放置關(guān)鍵詞搜索就得用關(guān)鍵詞。關(guān)鍵詞分析和選擇是SEO最重要的工作之一。首先要給網(wǎng)站確定主關(guān)鍵詞（一般在5個(gè)上后針對這些關(guān)鍵詞進(jìn)行優(yōu)化，包括關(guān)鍵詞密度（Density），相關(guān)度（Relavancy），突出性（Prominency）等等。4、了解主要的搜索引擎雖然搜索引擎有很多，但是對網(wǎng)站流量起決定作用的就那么幾個(gè)。比如英文的主要有Google，Yahoo,Bing等有百度，搜狗，有道等。不同的搜索引擎對頁面的抓取和索引、排序的規(guī)則都不一樣。還要了解各搜索門戶和搜2的關(guān)系，比如AOL網(wǎng)頁搜索用的是Google的搜索技術(shù)，MSN用的是Bing的技術(shù)。5、主要的互聯(lián)網(wǎng)目錄OpenDirectory自身不是搜索引擎，而是一個(gè)大型的網(wǎng)站目錄，他和搜索引擎的主要區(qū)別是網(wǎng)站內(nèi)容的收集7目錄是人工編輯的，主要收錄網(wǎng)站主頁；搜索引擎是自動(dòng)收集的，除了主頁外還抓取大量的內(nèi)容頁面。6、按點(diǎn)擊付費(fèi)的搜索引擎搜索引擎也需要生存，隨著互聯(lián)網(wǎng)商務(wù)的越來越成熟，收費(fèi)的搜索引擎也開始大行其道。最典型的有Overture當(dāng)然也包括Google的廣告項(xiàng)目GoogleAdwords。越來越多的人通過搜索引擎的點(diǎn)擊廣告來定位商業(yè)網(wǎng)站，這里面化和排名的學(xué)問，你得學(xué)會(huì)用最少的廣告投入獲得最多的點(diǎn)擊。7、搜索引擎登錄網(wǎng)站做完了以后，別躺在那里等著客人從天而降。要讓別人找到你，最簡單的辦法就是將網(wǎng)站提交submit）擎。如果你的是商業(yè)網(wǎng)站，主要的搜索引擎和目錄都會(huì)要求你付費(fèi)來獲得收錄（比如Yahoo要299美元），但是好消少到目前為止）最大的搜索引擎Google目前還是免費(fèi)，而且它主宰著60%以上的搜索市場。8、鏈接交換和鏈接廣泛度（LinkPopularity）網(wǎng)頁內(nèi)容都是以超文本（Hypertext）的方式來互相鏈接的，網(wǎng)站之間也是如此。除了搜索引擎以外，人們也不同網(wǎng)站之間的鏈接來Surfing（“沖浪”）。其它網(wǎng)站到你的網(wǎng)站的鏈接越多，你也就會(huì)獲得更多的訪問量。更首你的網(wǎng)站的外部鏈接數(shù)越多，會(huì)被搜索引擎認(rèn)為它的重要性越大，從而給你更高的排名。9、標(biāo)簽的合理使用7、我們知道可以以外鏈的方式引入CSS文件，請談?wù)勍怄溡隒SS有哪些方式，這些方式的性能有區(qū)別嗎。要說出CSS的引入方式，沒有什么難度，但要說到為什么使用不同的引入方式，就有些學(xué)問在里面了。CSS的引入方式最常用的有三種，第一：在head部分加入<linkrel="stylesheet"type="text/css"href="my.css"/>5［入外部的CSS文件。這種方法可以說是現(xiàn)在占統(tǒng)治地位的引入方法。如同IE與瀏覽器。這也是最能體現(xiàn)CSS特點(diǎn)的方法；最能體現(xiàn)DIV+CSS中的內(nèi)彳離的思想，也最易改版維護(hù)，代碼看起來也是最美觀的一種。第二：在head部分加入<styletype="text/css">div{margin:0;padding:0;border:1pxredsolid;}</style>這種方法的使用情況要少的多，最長見得就是訪問量大的門戶網(wǎng)站。或者訪問量較大的企業(yè)網(wǎng)站的首頁。與第一種方法比起來，1弊端也明顯。優(yōu)點(diǎn)：速度快，所有的CSS控制都是針對本頁面標(biāo)簽的，沒有多余的css命令；再者不用外鏈CSS文件。直接:文檔中讀取樣式。缺點(diǎn)就是改版麻煩些，單個(gè)頁面顯得臃腫，CSS不能被其他HTML引用造成代碼量相對較多，維護(hù)也麻煩J采用這種方法的公司大多有錢，對他們來說用戶量是關(guān)鍵，他們不缺人進(jìn)行復(fù)雜的維護(hù)工作。第三：直接在頁面的標(biāo)簽里加<divstyle="border:1pxredsolid;">^D試信息</div>這種方法現(xiàn)在用的很少，很多公司不了解前端技術(shù)的領(lǐng)導(dǎo)還對這種寫法很痛恨。認(rèn)為HTML里不能出現(xiàn)CSS命令。其實(shí)有時(shí)4沒有什么大不了。比如通用性差，效果特殊，使用CSS命令較少，并且不常改動(dòng)的地方，使用這種方法反而是很好的選擇。除了這三種常用的CSS引入方式，還有種很多人都沒有見過的引入方式<styletype="text/css">@importurl(my.css);</style>這就是第四種引入方式。在IBMH作的時(shí)候，只能使用一種Ajax框架，就是DOJO。而DOJO的CSS引用，就是采用了@1式。這種情況非常少，主要用在CSS文件數(shù)量龐大的負(fù)責(zé)的系統(tǒng)中。另外@important本身是一個(gè)CSS命令，是放在CSS文件里的LINK標(biāo)簽有很大的區(qū)別。8、CSSSprite是什么，談?wù)勥@個(gè)技術(shù)的優(yōu)缺點(diǎn)。CSSSprites在國內(nèi)很多人叫css精靈，是一種網(wǎng)頁圖片應(yīng)用處理方式。它允許你將一個(gè)頁面涉及到的所有零星圖片都包含到中去，這樣一來，當(dāng)訪問該頁面時(shí)，載入的圖片就不會(huì)像以前那樣一幅一幅地慢慢顯示出來了。對于當(dāng)前網(wǎng)絡(luò)流行的速度高于200KB的單張圖片的所需載入時(shí)間基本是差不多的，所以無需顧忌這個(gè)問題。加速的關(guān)鍵，不是降低重量，而是減少個(gè)數(shù)。傳統(tǒng)切圖講究精細(xì)，圖片規(guī)格越小越好，重量越小越好，其實(shí)規(guī)格大小無計(jì)算機(jī)統(tǒng)一都按byte計(jì)算?？蛻舳嗣匡@示一張圖片都會(huì)向服務(wù)器發(fā)送請求。所以，圖片越多請求次數(shù)越多，造成延遲的可越大。CSSSprites優(yōu)缺點(diǎn)利用CSSSprites能很好地減少了網(wǎng)頁的http請求，從而大大的提高了頁面的性能，這也是CSSSpri的優(yōu)點(diǎn)，也是其被廣泛傳播和應(yīng)用的主要原因；CSSSprites能減少圖片的字節(jié)，曾經(jīng)比較過多次3張圖片合并成1張圖片的字節(jié)總是小于這3張圖片E和。解決了網(wǎng)頁設(shè)計(jì)師在圖片命名上的困擾，只需對一張集合的圖片上命名就可以了，不需要對每一個(gè)小元素名，從而提高了網(wǎng)頁的制作效率。更換風(fēng)格方便，只需要在一張或少張圖片上修改圖片的顏色或樣式，整個(gè)網(wǎng)頁的風(fēng)格就可以改變。維護(hù)起方便。誠然CSSSprites是如此的強(qiáng)大，但是也存在一些不可忽視的缺點(diǎn)，如下：在圖片合并的時(shí)候，你要把多張圖片有序的合理的合并成一張圖片，還要留好足夠的空間，防止板塊內(nèi)不不必要的背景；這些還好，最痛苦的是在寬屏，高分辨率的屏幕下的自適應(yīng)頁面，你的圖片如果不夠?qū)?，很容背景斷裂；CSSSprites在開發(fā)的時(shí)候比較麻煩，你要通過photoshop或其他工具測量計(jì)算每一個(gè)背景單元的精確位是針線活，沒什么難度，但是很繁瑣；幸好騰訊的鬼哥用RIA開發(fā)了一個(gè)CSSSprites樣式生成工具，雖然些使用上的不靈活，但是已經(jīng)比photoshop測量來的方便多了，而且樣式直接生成，復(fù)制，拷貝就OK！CSSSprites在維護(hù)的時(shí)候比較麻煩，如果頁面背景有少許改動(dòng)，一般就要改這張合并的圖片，無需改的好不要?jiǎng)?，這樣避免改動(dòng)更多的css，如果在原來的地方放不下，又只能（最好）往下加圖片，這樣圖片的字加了，還要改動(dòng)css。CSSSprites非常值得學(xué)習(xí)和應(yīng)用，特別是頁面有一堆ico（圖標(biāo)）。總之很多時(shí)候大家要權(quán)衡一下再?zèng)Q定是不是應(yīng)用CSSSprites。9、以CSS3標(biāo)準(zhǔn)定義一個(gè)webkit內(nèi)核瀏覽器識(shí)別的圓角（尺寸隨意）-moz-border-radius:10px;-webkit-border-radius:10px;border-radius:10px;10、有這么一段HTML，請?zhí)裘。?lt;P>哥寫的不是HTML，是寂寞。<br><br>我說：<br>不要迷戀哥，哥只是一個(gè)傳說缺少p標(biāo)記的結(jié)束標(biāo)記。Doctype?嚴(yán)格模式與混雜模式-如何觸發(fā)這兩種模式，區(qū)分它們有何意義？Doctype聲明位于文檔中的最前面的位置，處于標(biāo)簽之前。此標(biāo)簽可告知瀏覽器文檔使用哪種HTML或XHTML規(guī)范。該標(biāo)簽可聲明三種DTD類型，格版本、過渡版本以及基于框架的HTML文檔。當(dāng)瀏覽器廠商開始創(chuàng)建與標(biāo)準(zhǔn)兼容的瀏覽器時(shí)，他們希望確保向后兼容性。為了實(shí)現(xiàn)這一點(diǎn)，他們創(chuàng)建了兩種呈現(xiàn)模式：標(biāo)準(zhǔn)模式和混雜模式（quirks標(biāo)準(zhǔn)模式中，瀏覽器根據(jù)規(guī)范呈現(xiàn)頁面；在混雜模式中，頁面以一種比較寬松的向后兼容的方式顯示?；祀s模式通常模擬老式瀏覽器（比如MicrosoftIE4Navigator4）的行為以防止老站點(diǎn)無法工作。瀏覽器根據(jù)DOCTYPE是否存在以及使用的哪種DTD來選擇要使用的呈現(xiàn)方法。如果XHTML文檔包含形式完整的DOCTYPE,那么它一般以標(biāo)準(zhǔn)模.于HTML4.01文檔，包含嚴(yán)格DTD的DOCTYPE常常導(dǎo)致頁面以標(biāo)準(zhǔn)模式呈現(xiàn)。包含過渡DTD和URI的DOCTYPE也導(dǎo)致頁面以標(biāo)準(zhǔn)模式呈現(xiàn)，但DTD而沒有URI會(huì)導(dǎo)致頁面以混雜模式呈現(xiàn)。DOCTYPE不存在或形式不正確會(huì)導(dǎo)致HTML和XHTML文檔以混雜模式呈現(xiàn)。2：行內(nèi)元素有哪些？塊級(jí)元素有哪些？CSS的盒模型?彳亍內(nèi)元素有：abspanIbemimginputselectstrong級(jí)元素有：divulollidldtddh1h2h3h4???p盒模型：marginborderpaddingwidthCSS引入的方式有哪些？link和@import的區(qū)別是？td,p（color:#c00;font-size:12px;}--></STYLE>使用STYLE屬性將STYLE屬性直接加在個(gè)別的元件標(biāo)簽里，〈元件（標(biāo)簽）STYLE="性質(zhì)（屬性）1:設(shè)定值1;性質(zhì)（屬性）2:設(shè)定值2;...}使用<span></span>標(biāo)記引入樣式<spanstyle="font:12px/20px#000000;"></span>兩者區(qū)別：加載順序的差別。當(dāng)一個(gè)頁面被加載的時(shí)候，link引用的CSS會(huì)同時(shí)被加載，而@import引用的CSS會(huì)等到頁面全部被下載完再被加載。以在css中再次引入其他樣式表，比如可以創(chuàng)建一個(gè)主樣式表，在主樣式表中再引入其他的樣式表，如：main.css@import"sub1.css"@import"sub2.css"這樣做有一個(gè)缺點(diǎn)，會(huì)對網(wǎng)站服務(wù)器產(chǎn)生過多的HTTP請求，以前是一個(gè)文件，而現(xiàn)在卻是兩個(gè)或更多文件了，服務(wù)器的壓力增大，瀏覽量大的網(wǎng)站還CSS選擇符有哪些？哪些屬性可以繼承？優(yōu)先級(jí)算法如何計(jì)算？內(nèi)聯(lián)和important哪個(gè)優(yōu)先級(jí)高?5:前端頁面有哪三層構(gòu)成，分別是什么？作用是什么？網(wǎng)頁分成三個(gè)層次，即：結(jié)構(gòu)層、表示層、行為層。網(wǎng)頁的結(jié)構(gòu)層(structurallayer)由HTML或XHTML之類的標(biāo)記語言負(fù)責(zé)創(chuàng)建。標(biāo)簽，也就是那些出現(xiàn)在尖括號(hào)里的單詞，對網(wǎng)頁內(nèi)容的語義含義做出這些標(biāo)簽不包含任何關(guān)于如何顯示有關(guān)內(nèi)容的信息。例如，P標(biāo)簽表達(dá)了這樣一種語義：“這是一個(gè)文本段?！本W(wǎng)頁的表示層(presentationlayer)由CSS負(fù)責(zé)創(chuàng)建。CSS對“如何顯示有關(guān)內(nèi)容”的問題做出了回答。網(wǎng)頁的行為層(behaviorlayer)負(fù)責(zé)回答“內(nèi)容應(yīng)該如何對事件做出反應(yīng)”這一問題。這是Javascript語言和DOM主宰的領(lǐng)域。6:css的基本語句構(gòu)成是?8：你做的頁面在哪些流覽器測試過？這些瀏覽器的內(nèi)核分別是什么？經(jīng)常遇到的瀏覽器的兼容性有哪些？怎么會(huì)出方法是什么？IE可梭瀏都.器I360.幽游，怛如III.說X曲MillTT1：=IE?勺榛用I覽熱1iref<ji(rtir^mei.擾!>誠雙仰虹■詢司甌土輯;I」」H頑附網(wǎng)Ad皋叫時(shí)4的；3都最簡早的解吏方毯就足.1Edisplay!nlins：JjD割C66JI而圭.鹽丈字布身的入小不我奔.同tf足fg革:14蹲鼻束體直字，在不問瀏覽舞下占的空間呈不一#的，■c卜坤郝占高iflpx.下圖U鄒隊(duì)If下實(shí)跖|「彌1中虬I俯白下囹「郭*，apmltiLU^麻T，解汽方案『給文字置能in^teyil-硬保所有文字卻有戴認(rèn)的linq-lieight值.地點(diǎn).撮常駐.詢履I?.在們不艷容霰Ipx的電導(dǎo).3一位下客fiS囊度旭定，MSei^XT醐*邊框的外肥就尚定了，小會(huì)被向暮就尤而屆1-1會(huì)裁心容抻文，暮即一5i_.L情-岬財(cái)虺#'；部洋國l■?.瑚0比-1.祉■［』泠內(nèi)芹庠城芹岑呵理，稀EIjfJ-如I!floal咨器I、匯g&f11'：勺容如山，1廊律JI瞽牌Y度,icF則函'泌庵內(nèi)容新《..W阿FmJH扭讖即T的辱麝需要宣SLwkith..5卑功的詁政rrw藺點(diǎn)浮動(dòng)卷Mi.皿￡inmorrnarginbug,?%舟-Z土卓也hfinal/景HJ,<■-土祐素如隹,七margin-top-14px.制1.-小:成efirgin-tkollnm;1-1pypadding也如K觀類岫』，鼠司;'l.ifi6|-伍」持產(chǎn).，凌茂bug出現(xiàn)時(shí)V一血敬為.V.■.!■.上4只呈H通現(xiàn)條fl,匝漫泵統(tǒng)琵刑，牌袂方慕外M元素設(shè)拒twrtfer或iSi-￡flaal7.吾吃斐孔迅叩篇船那3M%J「「-逐」酣，I卜網(wǎng)■個(gè)W,I.而的仙設(shè)晝首玨叫發(fā)現(xiàn)下面限山世宜廿我前曲也打」P思姑晚是吞吃觀虹財(cái)■『..I用的丫岸為電觀氧迎山澳可卜'電樞林伊側(cè)軋臘廿脊盡PIUIIzmiii：i.遙個(gè)znarn爵家足削說?缺削bu」i了IFJ“fl沌祥回1打岫出切倡.哭呈菌k息結(jié)這個(gè)s口俚.用物W案，*前這，、也T.大瑜會(huì)在頁而看到皓字出現(xiàn)西避,黛翼的內(nèi)容量田注釋的寥少而囊口陽快方星，用**<1-［ilIIE卜picRotatestart/店;］-^"A法圣勇瘁.土dh'>'p.'llII響叫M1澳斗湖，悚手的董咨H；遍,布村;I)犬小止祝，tftli"，淄售悸公“木同間悅料鈾果，懵下的牌牌酒邛!帆iaG下的蟀釋會(huì)讓的:摸即看囊毗巾『何晅的質(zhì)余性，?另擔(dān)一支專門埒*避伺S(ulff用心褊*一文里有相美旦果，卻沒皓tHi即時(shí)髀我的過近-id』eo下的窗白.科縻方室：iAimgtft定dlqilayMocko||XiInunaigH.tdiuslylc=,'lino-rioigH^Dpx''>dmfll^j.it!遇旭.r'lisG,卜甲汀』字linNwi/it效果甫失了...?！91同呈習(xí)Eg成i個(gè)inliniMk元素和inlirke元素可在一卸丁.解視佻；lmgH」立?字Smat起讓,外援的ficn回狀悉■HhogI響回5卜：30口網(wǎng)「做「恩讓散楊mvar時(shí),鏈板里■&舍的圖片況鹿變ft.hI^/LIWK互魁I扒tf卜配虹非遂授的Iww恭玄-dlHimrg速符的殲我y是不認(rèn)的，擊IM、If下才吉強(qiáng)孩io'|-qVBiflowhidden同］!一卜目絕"底posilior:atasdwc甌?HIIX-J.'>：positionifttaJdvB無魅?g.方熟overflowhiddenGilposiiion;r^livej!li$positior-absolLto>j.iet：Z-.}oue-rflow-xiiiLioverlow-yiiJl'i^l,i&7.ff爪戔拓.MF產(chǎn)茸的twflin(Hd元素如沒本文的度」內(nèi)祁如甫div*正義Tmight域w(Mn;L揪個(gè)故典了?I'iSi-ffifj，叩側(cè)知'蛔1響無盤切果十擔(dān)禮岫史發(fā)筮余的容器，孔妾的個(gè)項(xiàng)度的1成婭下的Byg.倦對定世的div下包蜜裙對定位盼同匝如果浩內(nèi)隹相H定位的diu高度幅嶺更具體血肉M相則尾將具有100蝠兩福dlh^,外#朗荊層再被掉大.解決方集祭內(nèi)M相則是Am*屬性.17.iiafiTEAbugI〈headsMiB毗《i*h<basctaigcl=,'_bank"pastieirrGlalvcl-ih'llaaBt史宇;無丸拓e.IS.丹于系丁個(gè)ft的現(xiàn)土widlZIOO祐d普樂西在甬里用很方IE-金向上讒跋宋widlh值.篷購叫妃ii琳”i言拽配.?挎?虹結(jié)kH比只噂啊恥偵村浮蜘出：i鋼M；1W%才代融「即計(jì)-匠E祖』偵」■」0如何居中一個(gè)浮動(dòng)元素？設(shè)置容器的浮動(dòng)方式為相對定位，然后確定容器的寬高，比如寬500高300的層，然后設(shè)置層的外邊距。div{Width:500px;height:300px;Margin:-150px00-250px;position:relative;left:50%;top:50%;}有沒有關(guān)注HTML5和CSS3?如有請簡單說一些您對它們的了解情況！HTML5標(biāo)簽的改變：<header>,<footer>,<dialog>,<aside>,<figure>,<section>等IE9以上開始支持CSS3實(shí)現(xiàn)圓角，陰影，對文字加特效，增加了更多的CSS選擇器。你怎么來實(shí)現(xiàn)下面這個(gè)設(shè)計(jì)圖,主要講述思路(效果圖省略)13:如果讓你來制作一個(gè)訪問量很高的大型網(wǎng)站，你會(huì)如何來管理所有CSS文件、JS與圖片?14：你對前端界面工程師這個(gè)職位是怎么樣理解的？它的前景會(huì)怎么樣？[Javascript]1：js是什么，js和html的開發(fā)如何結(jié)合？怎樣添加、移除、移動(dòng)、復(fù)制、創(chuàng)建和查找節(jié)點(diǎn)怎樣使用事件以及IE和DOM事件模型之間存在哪些主要差別面向?qū)ο缶幊?b怎么繼承a看看下面alert的結(jié)果是什么viewsourceprint?1.functionb(x,y,a)(.arguments[2]=10;.alert(a);}b(1,2,3);如果函數(shù)體改成下面，結(jié)果又會(huì)是什么？a=10;alert(arguments[2]);請編寫一個(gè)JavaScript函數(shù)parseQueryString，它的用途是把URL參數(shù)解析為一個(gè)對象varobj=parseQueryString(url);alert(obj.key0)//輸出0ajax是什么？ajax的交互模型？同步和異步的區(qū)別？如何解決跨域問題？什么是閉包？下面這個(gè)ul，如何點(diǎn)擊每一列的時(shí)候alert其index?<ulid=”test”><li>這是第一條</li><li>這是第二條</li><li>這是第三條</li></ul>最近看的一篇Javascript的文章是？常使用的庫有哪些？常用的前端開發(fā)工具？開發(fā)過什么應(yīng)用或組件？說說YSlow(可以詳細(xì)一點(diǎn))Class可繼承CSS選擇符有哪些？哪些屬性可以繼承？優(yōu)先級(jí)算法如何計(jì)算？內(nèi)聯(lián)和important哪個(gè)優(yōu)先級(jí)高？回答：]CLASS偽類A標(biāo)簽可以繼承列表ULLIDLDDDT可繼承優(yōu)先級(jí)就近原則，樣式定義最近者為準(zhǔn)載入樣式以最后載入的定位為準(zhǔn)優(yōu)先級(jí)為'important>[id>class>tag]Important比內(nèi)聯(lián)優(yōu)先級(jí)高5:前端頁面有哪三層構(gòu)成，分別是什么？作用是什么？回答：結(jié)構(gòu)層，表現(xiàn)層，定義層；6:css的基本語句構(gòu)成是？回答：選擇器、屬性和屬性值。8：你做的頁面在哪些流覽器測試過？這些瀏覽器的內(nèi)核分別是什么？經(jīng)常遇到的瀏覽器的兼容性有哪些？怎么解決方法是什么？回答：涉及到效率一般就在IEtextfirefox3.5軟件上測試模擬IE6IE7IE8內(nèi)核是IE7的瀏覽器PNG8格式背景圖透明JS報(bào)錯(cuò)，瀏覽器本身的兼容問題有些電腦IE7IE6下正常，有些提示錯(cuò)誤9.如何居中一個(gè)浮動(dòng)元素？回答：設(shè)置容器的浮動(dòng)方式為相對定位然后確定容器的寬高比如寬500高300的層然后設(shè)置層的外邊距.Div（Width:500px;height:300px;Margin:-150px00-250px;position:absolute;left:50%;top:50%;}有沒有關(guān)注HTML5和CSS3?如有請簡單說一些您對它們的了解情況！回答：HTML5沒有關(guān)注CSS3有關(guān)注比如對多背景圖圓角投影等樣式的關(guān)注13:如果讓你來制作一個(gè)訪問量很高的大型網(wǎng)站，你會(huì)如何來管理所有CSS文件、JS與圖片？回答：涉及到人手、分工、同步；先期團(tuán)隊(duì)必須確定好全局樣式（globe.css），編碼模式（utf-8）等編寫習(xí)慣必須一致（例如都是采用繼承式的寫法，單樣式都寫成一行）；標(biāo)注樣式編寫人，各模塊都及時(shí)標(biāo)注（標(biāo)注關(guān)鍵樣式調(diào)用的地方）；頁面進(jìn)行標(biāo)注（例如頁面模塊開始和結(jié)束）；CSS跟HTML分文件夾并行存放，命名都得統(tǒng)一（例如style.css）JS分文件夾存放命民以該JS功能為準(zhǔn)英文翻譯；圖片采用整合的images.pngpng8格式文件使用盡量整合在一起使用方便將來的管理14：你對前端界面工程師這個(gè)職位是怎么樣理解的？它的前景會(huì)怎么樣？是策劃UI設(shè)計(jì)需要轉(zhuǎn)換成程序可實(shí)施中的必須的中間環(huán)節(jié)，這個(gè)環(huán)節(jié)直接關(guān)系到頁面的正確高效穩(wěn)定還原策設(shè)計(jì)的效果，同時(shí)為程序套接做好程序表現(xiàn)基礎(chǔ)載體。這個(gè)工作的前景，只能是深造技術(shù)流的，模塊化管理，新白更新，對于向后兼容思維的逐步放棄，比如真的淘汰掉IE6后，向前的空間還是有的。前端開發(fā)工程師的前景是非碧現(xiàn)在各大IT企業(yè)都在招聘這方面的人才。WEB2.0的普及會(huì)更加促進(jìn)本行業(yè)本工種的繁榮。一、填空題（40分）1、目前常用的WEB標(biāo)準(zhǔn)靜態(tài)頁面語言是。（4分）html2、改變元素的外邊距用，改變元素的內(nèi)填充用。（6分）marginpadding3、在Table中，TR是，TD是。（6分）行列4、如果給一行兩列的表格（table）定義高度樣式，在標(biāo)簽中定義最合理，最能減少代碼的臃腫。（5分式也有說tr5、對ulli的樣式設(shè)成無，應(yīng)該是用什么屬性。（6分）list-styl-type：none；6、在新窗口打開鏈接的方法是。（4分）target=_bank7、Color:#666666;可縮寫為。（2分）color：#6668、合理的頁面布局中常聽過結(jié)構(gòu)與表現(xiàn)分離，那么結(jié)構(gòu)是，表現(xiàn)是。（9分）divcss二、選擇題（20分）11、列舉常用的瀏覽器類型以及他們使用的內(nèi)核還有對應(yīng)的調(diào)試工具常用的有IE（6,7,8,9,10,FF,chrome）IE常用的調(diào)試工具有l(wèi)EWebDeveloper（IE9默認(rèn)有安裝）Firefox大家估計(jì)用的最多。firefoxchrome（內(nèi)核webkit）自帶的有g(shù)oogle開發(fā)的內(nèi)置調(diào)試工具。三者內(nèi)核各不相同。其它還有opera，遨游，世界之窗等；chrome內(nèi)核跑的比較快，安全。Firefox做調(diào)試是最棒的。4、html5和css3有什么新特性html5強(qiáng)化了Web網(wǎng)頁的表現(xiàn)性能，^口:navheadersectioncanvas等，語義化更強(qiáng)css3新特性有陰影特效，圓角處理等，都是非常不錯(cuò)的效果；5、說出其他瀏覽器和IE瀏覽器在頁面元素引用有什么區(qū)別？這個(gè)和內(nèi)核有關(guān)系，及是否w3c來定制，不同瀏覽器渲染結(jié)果不同。目前國內(nèi)還有大部份使用IE6,常常web在制作的時(shí)候碰到兼容性的問題：如：display-block,padding,margin等盒子模型比較多。還有不同的字間距等產(chǎn)生的問題；常用解決的方法：IE6：_xxx:（｝IE7：*等處理不IE和其它不同瀏覽器間的差異；4、請選擇對javascript理解有誤的：（）javascript是網(wǎng)景公司開發(fā)的一種基于事件和驅(qū)動(dòng)網(wǎng)頁腳本語言JScript是javascript的簡稱FireFox和IE存在大量兼容性問題的主要原因在于他們對javascript的支持不同上AJAX技術(shù)一定要使用javascript技術(shù)TOC\o"1-5"\h\z5、在Jquery中下面哪一個(gè)是用來追加到指定元素的末尾的？（）A、insertAfter（）B、append（）C、appendTo（）D、after（）6、在javascript中定義變量vara=〃35〃，varb=〃7〃運(yùn)算a%b的結(jié)果為（）A、357B、57C、0D、57、下面哪種不屬于jquery的篩選？（）A、過濾B、自動(dòng)C、查找D、串聯(lián)8、有這樣一個(gè)表單元素，想要找到這個(gè)hidden元素，下面哪個(gè)是正確的？（）A、visibleB、hiddenC、visible（）D、overflow9、下面哪個(gè)屬于javascript的布爾型（）A、1.2B、“true"C、falseD、null10、onload事件是window的事件，但是在HTML中指定事件處理程序的時(shí)候，我們是把它寫在（）標(biāo)記中的。A、<body>B、<head>C、<form>D、<script>11、請選擇結(jié)果為真的表達(dá)式：（）A、nullinstanceofObjectB、null===undefinedC、C.null==undefinedD、NaN==NaN12、下列哪個(gè)對象是用來代表特定的窗口URL信息（）A、locationB、historyC、formD、frame13、（）是一個(gè)可以執(zhí)行的JavaScript代碼段。A、對象B、方法C、事件D、函數(shù)14、在window窗口對象中，（）使焦點(diǎn)從窗口移走，窗口變?yōu)?'非活動(dòng)窗口〃。A、focus（）B、blur（）C、password（）D、check（）TOC\o"1-5"\h\z15、下面哪個(gè)屬于javascript的字符型（）A、falseB、你好C、''123〃D、null16、下列運(yùn)算方式不屬于邏輯運(yùn)算的是（）A、!aB、a&&bC、aIIbD、a>b17、關(guān)于變量的聲明，下列選項(xiàng)闡述不正確的是（）A、變量聲明時(shí)，所有類型均由小寫var聲明，如varname=“張勇〃sex=“女生〃B、可以以字母、下劃線或者數(shù)字開頭C、變量名區(qū)分大小寫D、變量名不能是Javascript的保留字18、（）指瀏覽器的瀏覽歷史對象A、historyB、locationC、windowD、protocol19、JavaScript是一種基于（）的安全腳本語言。A、對象B、方法C、事件D、對象和事件驅(qū)動(dòng)HTTP協(xié)議的狀態(tài)消息都有哪些?（如200、302對應(yīng)的描述）AJAX是什么？AJAX的交互模型（流程）？AJAX跨域的解決辦法？同步和異步的區(qū)別？簡述JavaScript封裝。5.JavaScript繼承有哪兩種形式形式，進(jìn)行描述。什么是閉包?以下代碼點(diǎn)擊<p>會(huì)輸出什么?為什么?能大概說明白的話繼續(xù)問能想出幾種解決辦法。<!DOCTYPEHTML><html><head><metacharset="utf-8"/><title>閉包演示</title><styletype="text/css">p{background:gold;}</style><scripttype="text/javascript">functioninit(){varpAry=document.getElementsByTagName("p");for(vari=0;i<pAry.length;i++){pAry[i].onclick=function(){alert(i);}}}</script></head><bodyonload="init();"><p>產(chǎn)品0</p><p>產(chǎn)品1</p><p>產(chǎn)品2</p><p>產(chǎn)品3</p><p>產(chǎn)品4</p></body></html>7.在JS中this關(guān)鍵字的使用場合和用法(如在構(gòu)造函數(shù)中、setTimeout中等)。簡述下cookie的操作，還有cookie的屬性都知道哪些。IE與FF的JS兼容性都知道哪些。10.DOM操作-怎樣添加、移除、移動(dòng)、復(fù)制、創(chuàng)建和查找節(jié)點(diǎn)（這個(gè)問題真心是基礎(chǔ)題，一般不會(huì)問）。jQuery相關(guān)jQuery源碼是否嘗試去讀過？說說基本的架構(gòu)或者jQuery.fn.init中都做了哪些判斷。都知道哪些不好的jQuery書寫方式。Sizzle是否有讀過？其它相關(guān)的加分項(xiàng)：都使用和了解過哪些編輯器?都使用和了解過哪些日常工具？都知道有哪些瀏覽器內(nèi)核?開發(fā)過的項(xiàng)目都兼容哪些瀏覽器？國內(nèi)外的JS牛人都知道哪些？瀑布流布局或者流式布局是否有了解4.正則表達(dá)式有系統(tǒng)學(xué)習(xí)過嗎（看書或網(wǎng)上教程）?有的話就問問

簡單點(diǎn)的郵箱驗(yàn)證、URL驗(yàn)證，或者問問貪婪匹配與懶惰匹配的理論知識(shí)。Node.js是否有過嘗試?到什么程度?說說個(gè)人理解的看法？HTML5都有哪些新的JSAPI?前端優(yōu)化知識(shí)都知道哪些？基礎(chǔ)算法題（如快速排序，能否一兩句說說重要的核心原理或者數(shù)組消重等）。是否有接觸過或者了解過重構(gòu)。1、javascript的數(shù)據(jù)類型不包括（a）A.漢字型B.數(shù)值型2、以下哪條語句不能創(chuàng)建對象：（A.varobj=（）;B.varobj=[];C.對象型)C.varobj={};D.布爾型D.varobj=//;3、javascript的單行注釋方式（c）A.{}B.<!-->C.//20、關(guān)于下列運(yùn)算符與表達(dá)式敘述不正確的是（）D./*****/A、delete是用來刪除對象、屬性、數(shù)組、變量，刪除成功返回true，刪除失敗返回falseB、typeof是用來判斷操作數(shù)類型C、this代表當(dāng)前對象，因此在不同的地方就有不同的結(jié)果D、new能用來聲明變量，并給變量賦值21、寫"HelloWorld"的正確Javascript語法是（）A、("HelloWorld")B、"HelloWorld"C、response.write("HelloWorld")D、document.write("HelloWorld")TOC\o"1-5"\h\z22、如何在警告框中寫入"HelloWorld"?()A、alertBox="HelloWorld"B、msgBox("HelloWorld”)C、alert("HelloWorld”)D、alertBox("HelloWorld”)23、如何創(chuàng)建函數(shù)()A、function:myFunction()B、functionmyFunction()C、function=myFunction()24、如何調(diào)用名為"myFunction"的函數(shù)()A、callfunctionmyFunctionB、callmyFunction()C、myFunction()25、如何編寫當(dāng)i等于5時(shí)執(zhí)行一些語句的條件語句？()A、if(i==5)B、ifi=5thenC、ifi=5D、ifi==5then26、jQuery中如果需要匹配包含文本的元素，用下面哪種來實(shí)現(xiàn)？()A、text()B、contains()C、input()D、attr(name)27、在JavaScript中，有多少種不同類型的循環(huán)()A、兩種。for循環(huán)和while循環(huán)。B、三種。for循環(huán)、while循環(huán)、do...while。C、一種。for循環(huán)。28、for循環(huán)如何開始()A、if(i!=5)B、for(i<=5;i++)C、for(i=0;i<=5;i++)D、fori=1to529、定義JavaScript數(shù)組的正確方法是()A、vartxt=newArray="George”,"John”,"Thomas”B、vartxt=newArray(1:"George”,2:"John”,3:"Thomas")C、vartxt=newArray("George”,"John”,"Thomas")D、vartxt=newArray:1=("George")2=("John")3=("Thomas")30、如何把7.25四舍五入為最接近的整數(shù)()A、round(7.25)B、rnd(7.25)C、Math.rnd(7.25)D、Math.round(7.25)31、如何求得2和4中最大的數(shù)？()A、Math.ceil(2,4)B、Math.max(2,4)C、ceil(2,4)D、top(2,4)32、在jquey中，如果想要從DOM中刪除所有匹配的元素，下面哪一個(gè)是正確的？()A、delete()B、empty()C、remove()D、removeAll()33、如何在瀏覽器的狀態(tài)欄放入一條消息()A、statusbar="putyourmessagehere"B、window.status="putyourmessagehere"C、window.status("putyourmessagehere")D、status("putyourmessagehere")TOC\o"1-5"\h