為什么先加載css后加載js

1,幾個使用的BOM屬性對象方法

什么是BOM复凳,BOM是瀏覽器對象溯乒,有哪些常用的BOM屬性呢瘟檩?

1,location
location.href-- 返回或設(shè)置當前文檔的URL

location.search -- 返回URL中的查詢字符串部分各聘。例如:
http://www.dreamdu.com/dreamdu.php?id=5&name=dreamdu返回包括(?)后面的內(nèi)容?id=5&name=dreamdu

location.hash -- 返回URL#后面的內(nèi)容寓娩,如果沒有#吭历,返回空

location.host -- 返回URL中的域名部分堕仔,例如
www.dreamdu.com

location.hostname -- 返回URL中的主域名部分,例如dreamdu.com

location.pathname -- 返回URL的域名后的部分晌区。例如http://www.dreamdu.com/xhtml/返回/xhtml/

location.port -- 返回URL中的端口部分摩骨。例如http://www.dreamdu.com:8080/xhtml/返回8080

location.protocol -- 返回URL中的協(xié)議部分。例如http://www.dreamdu.com:8080/xhtml/ 返回(//)前面的內(nèi)容http:

location.reload() -- 重載當前頁面

2,history對象

history.go(num) 前進或者后退指定的頁面數(shù)

history.back() 后退一頁

history.forward() 前進一頁

3朗若,navigator對象

navigator.userAgent -- 返回用戶代理頭的字符串表示(就是包括瀏覽器版本信息等的字符串)

navigator.cookieEnabled -- 返回瀏覽器是否支持(啟用)cookie

2,說下http2.0

http和https的區(qū)別:https是基于ssl加密的http協(xié)議

http2.0提升訪問速度恼五、允許多路復用、服務(wù)端推送哭懈、首部壓縮

3,400 401 403狀態(tài)碼

400:請求無效

產(chǎn)生原因:前端提交請求的字段名或者類型與后端的實體沒有保持一致

401:當前請求需要用戶驗證

403:服務(wù)器已經(jīng)得到請求灾馒,但是拒絕執(zhí)行

狀態(tài)碼大全:https://www.php.cn/web/web-http200.html

4,fetch發(fā)送兩次請求的原因

fetch發(fā)送post請求的時候,總是發(fā)送兩次遣总,第一次狀態(tài)是204睬罗,第二次才成功?

因為fetch發(fā)送post請求的時候旭斥,導致fetch第一次發(fā)送了一個options請求容达,詢問服務(wù)器是否支持修改的請求頭,如果服務(wù)器支持垂券,則在第二次中發(fā)送真正的請求

5,js中defer和async區(qū)別

defer(延遲腳本):

 <script defer type="text/javascript" src="test.js"></script>

defer只適用于外部腳本文件

這個屬性的作用是表明腳本在執(zhí)行時不會影響頁面的構(gòu)造花盐,也就是說,腳本會被延遲到整個頁面都解析完畢后運行菇爪。也就相當于告訴瀏覽器立即下載算芯,但延遲執(zhí)行

HTML5規(guī)范要求腳本按照它們出現(xiàn)的先后順序執(zhí)行,因此第一個延遲腳本會先于第二個延遲腳本執(zhí)行

async(異步腳本):

<script async type="text/javascript" src="test1.js"></script>
<script async type="text/javascript" src="test2.js"></script>

異步腳本:async屬性只適用于外部腳本文件凳宙,并告訴瀏覽器立即下載文件

但與defer不同的是:標記為async的腳本并不保證按照指定他們的先后順序執(zhí)行

上面代碼test2.js可能會在test1.js之前執(zhí)行

6,為什么先加載css后加載js

先加載css后加載js熙揍,因為css加載會阻塞瀏覽器渲染,為了打開網(wǎng)頁白屏時間縮短近速,會優(yōu)先選擇加載css诈嘿;后加載js是因為js中可能會修改DOM元素,js加載會阻塞瀏覽器解析html削葱,造成獲取不到DOM的情況奖亚。

<head>
  <meta charset="utf-8">
  <title></title>
  <link rel="stylesheet" href="css/*.css" rel="external nofollow" >
  <script src="js/*.js></script>
</head>

DOM文檔的加載順序是由上而下的順序加載

1,DOM加載到link標簽

css文件的加載是與DOM的加載并行的,也就是說析砸,css在加載時Dom還在繼續(xù)加載構(gòu)建昔字,而過程中遇到的css樣式或者img,則會向服務(wù)器發(fā)送一個請求,待資源返回后作郭,將其添加到dom中的相對應(yīng)位置中陨囊;

2,DOM加載到script標簽

由于js文件不會與DOM并行加載,因此需要等待js整個文件加載完之后才能繼續(xù)DOM的加載夹攒,倘若js腳本文件過大蜘醋,則可能導致瀏覽器頁面顯示滯后,出現(xiàn)“假死”狀態(tài)咏尝,這種效應(yīng)稱之為“阻塞效應(yīng)”压语;會導致出現(xiàn)非常不好的用戶體驗;

而這個特性也是為什么在js文件中開頭需要$(document).ready(function(){})或者(function(){})或者window.onload,即是讓DOM文檔加載完成之后才執(zhí)行js文件编检,這樣才不會出現(xiàn)查找不到DOM節(jié)點等問題胎食;

js阻塞其他資源的加載的原因是:瀏覽器為了防止js修改DOM樹,需要重新構(gòu)建DOM樹的情況出現(xiàn)允懂;

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末厕怜,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子蕾总,更是在濱河造成了極大的恐慌粥航,老刑警劉巖,帶你破解...
    沈念sama閱讀 218,607評論 6 507
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件谤专,死亡現(xiàn)場離奇詭異躁锡,居然都是意外死亡午绳,警方通過查閱死者的電腦和手機置侍,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,239評論 3 395
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來拦焚,“玉大人蜡坊,你說我怎么就攤上這事∈臧埽” “怎么了秕衙?”我有些...
    開封第一講書人閱讀 164,960評論 0 355
  • 文/不壞的土叔 我叫張陵,是天一觀的道長僵刮。 經(jīng)常有香客問我据忘,道長,這世上最難降的妖魔是什么搞糕? 我笑而不...
    開封第一講書人閱讀 58,750評論 1 294
  • 正文 為了忘掉前任勇吊,我火速辦了婚禮,結(jié)果婚禮上窍仰,老公的妹妹穿的比我還像新娘汉规。我一直安慰自己,他們只是感情好驹吮,可當我...
    茶點故事閱讀 67,764評論 6 392
  • 文/花漫 我一把揭開白布针史。 她就那樣靜靜地躺著晶伦,像睡著了一般。 火紅的嫁衣襯著肌膚如雪啄枕。 梳的紋絲不亂的頭發(fā)上婚陪,一...
    開封第一講書人閱讀 51,604評論 1 305
  • 那天,我揣著相機與錄音频祝,去河邊找鬼近忙。 笑死,一個胖子當著我的面吹牛智润,可吹牛的內(nèi)容都是我干的及舍。 我是一名探鬼主播,決...
    沈念sama閱讀 40,347評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼窟绷,長吁一口氣:“原來是場噩夢啊……” “哼锯玛!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起兼蜈,我...
    開封第一講書人閱讀 39,253評論 0 276
  • 序言:老撾萬榮一對情侶失蹤攘残,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后为狸,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體歼郭,經(jīng)...
    沈念sama閱讀 45,702評論 1 315
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,893評論 3 336
  • 正文 我和宋清朗相戀三年辐棒,在試婚紗的時候發(fā)現(xiàn)自己被綠了病曾。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 40,015評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡漾根,死狀恐怖泰涂,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情辐怕,我是刑警寧澤逼蒙,帶...
    沈念sama閱讀 35,734評論 5 346
  • 正文 年R本政府宣布,位于F島的核電站寄疏,受9級特大地震影響是牢,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜陕截,卻給世界環(huán)境...
    茶點故事閱讀 41,352評論 3 330
  • 文/蒙蒙 一驳棱、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧艘策,春花似錦蹈胡、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,934評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽却汉。三九已至,卻和暖如春荷并,著一層夾襖步出監(jiān)牢的瞬間合砂,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,052評論 1 270
  • 我被黑心中介騙來泰國打工源织, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留翩伪,地道東北人。 一個月前我還...
    沈念sama閱讀 48,216評論 3 371
  • 正文 我出身青樓谈息,卻偏偏與公主長得像缘屹,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子侠仇,可洞房花燭夜當晚...
    茶點故事閱讀 44,969評論 2 355

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