為什麼css放上面js放下面

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的解析。

當解析過程中遇到

• css背景超出寬度怎麼辦
• apache不載入css檔怎麼辦
• css 如何設定方形項目的列表
• css怎麼設定文字加粗
• 怎樣壓縮js css