CSS和JS在網(wǎng)頁中的放置順序是怎樣的?
css使用link標(biāo)簽放在頂部 <head></head>
中阁簸。
- 把css樣式放在底部會出現(xiàn)白屏苏揣,fouc等現(xiàn)象仔戈。
- 使用@import標(biāo)簽即使放在link標(biāo)簽中且放在頭部吆寨,也有可能出現(xiàn)白屏赏淌。
js放在底部
放前面因?yàn)閖s是按順序加載,腳本會阻塞后面內(nèi)容的呈現(xiàn)啄清,會阻塞其后組件的下載六水,也會出現(xiàn)白屏現(xiàn)象。
解釋白屏和FOUC
白屏:瀏覽器在等待頁面組件包括樣式表全部加載完成后才呈現(xiàn)整個頁面辣卒。若樣式表放在頁面底部缩擂,將會出現(xiàn)白屏√硭拢——樣式表在頁面中位置并不影響頁面中組件的下載時間,但是會影響頁面的呈現(xiàn)懈费。
fouc:如果把樣式放在底部,對于IE瀏覽器,在某些場景下(點(diǎn)擊鏈接,輸入URL,使用書簽進(jìn)入等),會出現(xiàn) FOUC 現(xiàn)象(逐步加載無樣式的內(nèi)容,等CSS加載后頁面突然展現(xiàn)樣式).對于 Firefox 會一直表現(xiàn)出 FOUC .
async和defer的作用是什么计露?有什么區(qū)別
defer使得browsers延遲腳本的執(zhí)行,直到文檔的載入和解析完成憎乙,并可以操作(在onload事件觸發(fā)前)票罐。
async使得browsers可以盡快地執(zhí)行腳本,而不用在下載腳本時阻塞文檔解析(異步)泞边。在不支持async的browsers中该押,通過動態(tài)創(chuàng)建<script>元素并把它插入文檔中,來實(shí)現(xiàn)腳本的異步載入和執(zhí)行阵谚。
若兩個屬性同在蚕礼,會忽略defer而遵從async
簡述網(wǎng)頁的渲染機(jī)制
- 解析html標(biāo)簽,構(gòu)建dom樹
- 解析css標(biāo)簽梢什,構(gòu)建cssom樹
- 把dom和cssom組合成渲染樹(render tree)
- 在渲染樹的基礎(chǔ)上進(jìn)行布局奠蹬,計算每個節(jié)點(diǎn)的幾何結(jié)構(gòu)
- 把每個節(jié)點(diǎn)繪制到屏幕
JavaScript 定義了幾種數(shù)據(jù)類型? 哪些是簡單類型?哪些是復(fù)雜類型?
JS定義了5種簡單類型:Undefined;Null;Boolean;Number和String
1種復(fù)雜類型:Object
NaN、Undefined嗡午、Null分別代表什么?
NaN:"not a number"即非數(shù)值囤躁,用于表示一個本來要返回數(shù)值的操作數(shù)未返回數(shù)值的情況,任何涉及NaN的操作都會返回NaN。
Undefined:代表聲明變量但未對其初始化狸演。
Null:表示一個空對象指針言蛇,常用于定義變量用于將來保存對象。
typeof和instanceof的作用和區(qū)別?
typeof:一元運(yùn)算符宵距,用來返回操作數(shù)類型的字符串腊尚。
instanceof 運(yùn)算符是用來測試一個對象是否在其原型鏈原型構(gòu)造函數(shù)的屬性。其語法是object instanceof constructor消玄。
代碼1:
代碼2:
代碼3:
代碼4:
var arr = [3,4,5]; for(i=0;i<3;i++){ console.log(arr[i]*arr[i]) };
代碼5:
var obj = {name:'hunger',sex:'mail',age:'28'} for(key in obj){ console.log(obj[key]); };
代碼6: