面試題小結(jié)及相關(guān)知識(shí)點(diǎn)

前端面試題總結(jié)

寫在前面:今天晚上開始看網(wǎng)上的前端題了,盡管目前離求職還有很遠(yuǎn),但我覺(jué)得這并不是沒(méi)有必要,我始終相信學(xué)習(xí)東西需要不斷的沁入到這些知識(shí)點(diǎn)中去,并不是因?yàn)槲覀凂R山要用的時(shí)候才去看某樣?xùn)|西,而是在急需用到的時(shí)候,我們的腦回路里面突然閃現(xiàn):在某個(gè)時(shí)候偶然看到的一個(gè)知識(shí)點(diǎn),然后自己能順著這個(gè)進(jìn)行聯(lián)想,而這可能也正是非科班生所缺少的吧。

HTML

  • 文檔類型聲明的作用?

    <!DOCTYPE html>的作用是將標(biāo)簽語(yǔ)言與相應(yīng)的文檔類型定義相關(guān)聯(lián)起來(lái)。

    只有確定了一個(gè)正確的文檔類型,超文本標(biāo)記語(yǔ)言或可擴(kuò)展超文本標(biāo)記語(yǔ)言中的標(biāo)簽和層疊樣式表才能生效,甚至對(duì)JavaScript腳本都會(huì)有所影響。


涉及到的知識(shí)點(diǎn):

  1. DTD文檔類型定義
  2. 超文本標(biāo)記語(yǔ)言下的文檔類型聲明是用來(lái)告知瀏覽器當(dāng)前文檔用的是哪種超文本規(guī)范。
  3. 超文本中的文檔類型聲明有三種:嚴(yán)格型、過(guò)渡性、框架集型。過(guò)渡模式包含了W3C標(biāo)準(zhǔn),同時(shí)也可以使用不被W3C標(biāo)準(zhǔn)所推薦的標(biāo)簽
  4. HTML5的文檔聲明只需要寫成<!DOCTYEPE>
  5. DOCTYPE的模式區(qū)分是從HTML4開始的。
  6. 沒(méi)有文檔聲明,瀏覽器則會(huì)采用怪異模式。

  • 瀏覽器有哪些模式?各種模式之間的區(qū)別是什么?

瀏覽器有三種模式:標(biāo)準(zhǔn)模式、幾乎模式、怪異模式;即standards moded、almost stadards mode/quirks mode;

區(qū)別:標(biāo)準(zhǔn)模式瀏覽器會(huì)以W3C標(biāo)準(zhǔn)來(lái)渲染網(wǎng)頁(yè),而怪異模式時(shí)瀏覽器則會(huì)以老版本的方式來(lái)渲染網(wǎng)頁(yè),,而且不同的瀏覽器的怪異模式還不一樣,所以在寫代碼的時(shí)候應(yīng)該避免這種錯(cuò)誤。至于幾乎模式則是一種介于標(biāo)準(zhǔn)模式和怪異模式之間的一種過(guò)渡模式。


  1. 瀏覽器模式與文檔模式有什么區(qū)別?如果存在一個(gè)完整的DOCTYPE,即文檔聲明,則瀏覽器會(huì)采用標(biāo)準(zhǔn)模式,否則瀏覽器會(huì)采用怪異模式。
  2. 在js中如何判斷瀏覽器模式?document對(duì)象的compatMode,它有兩個(gè)值,backCompat對(duì)應(yīng)怪異模式,CSS1compat對(duì)應(yīng)嚴(yán)格模式。

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

簡(jiǎn)單的將html是一種標(biāo)簽語(yǔ)言,而xhtml則是這種標(biāo)簽語(yǔ)言的規(guī)范版本,xhtml是xml + html,即用xml的方式寫html。xhtml出現(xiàn)的初衷是為了解決互聯(lián)網(wǎng)大量web頁(yè)面包含錯(cuò)誤的問(wèn)題,但由于xhtml會(huì)強(qiáng)制性報(bào)錯(cuò),所以并不是非常受歡迎,所以最終html5的出現(xiàn)洗去了這個(gè)教訓(xùn),即向后兼容的特性。

  • 如果頁(yè)面使用‘a(chǎn)pplication/xhtml + xml’會(huì)有什么問(wèn)題?

不滿足向后兼容的要求,老式的瀏覽器可能并不支持。這也是xhtml的局限,即要求必須:有html、title、head body,標(biāo)簽必須關(guān)閉,所有標(biāo)簽名都必須小寫,所有XHTML都必須有文檔聲明,否則就會(huì)報(bào)錯(cuò)。

  • 如果網(wǎng)頁(yè)內(nèi)需要支持多種語(yǔ)言應(yīng)該怎么做?

1、首先是不同語(yǔ)言的編碼問(wèn)題:對(duì)提供多語(yǔ)言的網(wǎng)頁(yè)來(lái)說(shuō),采用unicode字符集是一種非常好的選擇,幾乎涵蓋了所有的語(yǔ)言的每一種字符。

2、其次,不同語(yǔ)言的書寫習(xí)慣可能不一樣,有的向左有的向右。

3.還應(yīng)該考慮到不同語(yǔ)言地?cái)?shù)據(jù)庫(kù)的檢索和收集。


  1. 詳細(xì)解釋一下unicode字符集?
  2. 什么是utf-8?為什么要把非中文的頁(yè)面的字符集定位utf-8?
  3. 數(shù)據(jù)庫(kù)驅(qū)動(dòng)網(wǎng)站

  • 使用data-屬性的好處是什么?

關(guān)于什么是data- 屬性:即data- 前綴 加自定義的屬性名,這種結(jié)構(gòu)可以用來(lái)儲(chǔ)存信息。

data-*屬性來(lái)自HTML5,可以通過(guò)添加data- 前綴的方法自定義的保存特定元素的數(shù)據(jù)。同時(shí)在HTML5中元素有一個(gè)dataset的屬性,可以通過(guò)JavaScript來(lái)操作,只是要注意的是:在JavaScript中操作時(shí)不用加前綴data- ,僅僅需要在dataset后面加 .自定義屬性名。

優(yōu)點(diǎn)即是可以不通過(guò)ajax、服務(wù)端數(shù)據(jù)庫(kù)查詢來(lái)創(chuàng)建更好的用戶體驗(yàn)。

怎樣使用data?在html通過(guò)data對(duì)元素進(jìn)行標(biāo)記,然后在css同進(jìn)行原則,通過(guò)這個(gè)屬性來(lái)增加樣式。在jquery中也可以通過(guò)對(duì)data- 的選擇來(lái)操作dom節(jié)點(diǎn)。但是要注意的是:無(wú)論在css中還是在jquery中,data- 實(shí)質(zhì)上都是屬性,而不僅僅是class一樣的,可以通過(guò) .className 名來(lái)選擇。比如在jquery中對(duì)data- 的選擇就是 $('元素名‘).attr('data- '), .attr()即是獲取某個(gè)屬性的值得方法。


  • 如果把html5看作是一個(gè)開放平臺(tái),它的構(gòu)建模塊有哪些?

有 <nav> <header> <section> <footer>

  • 使用哪些工具可測(cè)試代碼性能?

JSPerf Profiler

*描述cookies、sessionStorage、localStorage的區(qū)別?

三者的共同點(diǎn)是:都屬于在瀏覽器端儲(chǔ)存數(shù)據(jù),從而避免了不斷的請(qǐng)求服務(wù)器來(lái)交換數(shù)據(jù)。cookies是最早用來(lái)在瀏覽器端儲(chǔ)存數(shù)據(jù)的,而另外兩個(gè)都是在HTML5出現(xiàn)的,二者都是window的屬性。localStorage是一直屬于本地的,而sessionStorage只會(huì)伴隨著session的存在而存在,即一旦窗口關(guān)閉,則sessionStorage則消失。(詳細(xì)看下二者的使用方法)

不同點(diǎn):
1.sessionStorage是在同源的窗口中始終存在的數(shù)據(jù),只要這個(gè)窗口沒(méi)有被關(guān)閉,進(jìn)入同源的其他頁(yè)面,數(shù)據(jù)也同樣是存在的。
2. 但如果同時(shí)打開兩個(gè)獨(dú)立的窗口,即便是同一頁(yè)面,sessionStorage也是不同的cookies會(huì)發(fā)送到服務(wù)器端。
  • 為什么要將<link>放在<head></head>之間,而把 < script>放在</body>之前?有不有例外?

(將<link>放在</head>之前的原因是為了讓html頁(yè)面在渲染之前就將css樣式文件提前加載好;script放body前的原因是為了讓html頁(yè)面在完全渲染完畢后再執(zhí)行js動(dòng)態(tài)操作,否則會(huì)出現(xiàn)一些dom元素還沒(méi)有加載完畢,就開始對(duì)其執(zhí)行操作,而找不到相關(guān)對(duì)象的問(wèn)題。)(這是我自己的回答)

*上面的這個(gè)問(wèn)題設(shè)計(jì)到瀏覽器的渲染機(jī)制的問(wèn)題!

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

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