為什麼css放上面js放下面
- 藏色散人原創
- 2021-01-27 09:12:283744瀏覽
css放上面js放下面的原因：1、在載入html產生DOM tree的時候，可以同時對DOM tree進行渲染，這樣可以防止閃跳，白屏或者佈局混亂；2、javascript加載後會立即執行，同時會阻塞後面的資源載入。
本文操作環境：Windows7系統、HTML5&&CSS3版，DELL G3電腦。
推薦：css影片教學
href和src的區別
一般載入CSS用href,並放在頭部；載入script用src，放在body內的下方。
href
是hypertext reference的縮寫，表示超文本引用，用來建立目前元素和文件間的連結。常用的有link，a。
當CSS使用href引用，瀏覽器會辨識該文件問CSS，並行下載，不會停止目前文件的載入。
src
是source的縮寫，是資源，頁面不可或缺的一部分，src指向的內容會嵌入到文件中目前標籤的位置。常用的有img, script, iframe。
當script使用src引用，瀏覽器解析到該元素時會停止對文件的渲染，直到該資源載入完成。這也是將script放底部而不是頭部的原因。
把CSS放頭部，script放下方的原因
1、CSS放頭部
#在載入html產生DOM tree的時候，就可以同時對DOM tree進行渲染。
這樣可以防止閃跳，白色螢幕或佈局混亂。
2、javascript放在後面
javascript可能會改變DOM tree的結構，所以需要一個穩定的DOM tree。
javascript載入後會立即執行，同時會阻塞後面的資源載入。 （javascript載入與執行的特點）
拓展知識：
1、首先讓我們先認識幾個常見的問題：
1.在進行頁面優化的時候，需要將css放在頭部，將js檔案放在尾部，這樣做為什麼能夠實現頁面的最佳化?
2.在使用jquery的時候，為什麼把函數寫在$(document).ready ()事件中？
3.javascript會阻塞dom的解析。
當解析過程中遇到