首頁猿問關(guān)于html頁面中各種文件的加載問...

關(guān)于html頁面中各種文件的加載問題著重是script加載問題

JavaScript

不負(fù)相思意 2019-02-13 21:39:00

在一個(gè)頁面中加載各種文件<head> <meta charset="UTF-8" /> <title>Document</title> <link rel="stylesheet" href="1.css" /> <link rel="stylesheet" href="2.css" /></head><body> <ul> <li>1</li> <li>2</li> <li>3</li> <li>4</li> </ul> <script src="1.js"></script> <script src="2.js"></script></body>如上所示，css文件跟body中的dom是不是同時(shí)進(jìn)行加載，亦或還有script中的文件也是進(jìn)行同時(shí)加載，看了很多關(guān)于頁面渲染的文章，但還是沒搞懂到底是怎么加載的?？吹降淖疃嗟木褪墙馕鰆s文件的時(shí)候其他文件會(huì)被阻塞，但是js文件是什么時(shí)候加載的，不是很清楚？

查看完整描述

1 回答

幕布斯7119047

TA貢獻(xiàn)1794條經(jīng)驗(yàn) 獲得超8個(gè)贊

解答這個(gè)問題需要了解瀏覽器引擎渲染頁面是順序執(zhí)行的，也就是從上到下執(zhí)行代碼，如果css、js文件放在head中，就會(huì)等待這些文件執(zhí)行完畢才往下執(zhí)行。由于js是單線程，如果文件過大，或代碼質(zhì)量不高就會(huì)發(fā)生堵塞，導(dǎo)致下面的代碼無法執(zhí)行，也就是出現(xiàn)白屏現(xiàn)象。
為了避免此類情況的出現(xiàn)，一般推薦把css樣式代碼放置于上方，把js控制代碼放置于最后面執(zhí)行。而且需要知道的是html展現(xiàn)結(jié)構(gòu)，css展現(xiàn)樣式，js實(shí)現(xiàn)控制，先把結(jié)構(gòu)和樣式優(yōu)先渲染出來也能很好地提升用戶體驗(yàn)。

反對(duì) 回復(fù) 2019-02-16