為什麼要把JavaScript檔放在Html底部

把JavaScript檔案放在Html底部是因為瀏覽器載入完JS檔案就會去執行，這時候如果JS裡面有對DOM的操作的話，DOM可能還沒載入完，就會出錯，另外由於JS對頁面的展示來說沒什麼用，所以應先載入CSS以達到盡快顯示出頁面的目的。

這個問題有兩個考量：

• 如果是外部載入的js，也就是透過src載入的外部js，  這種方式呼叫的js之所以要放到底部是因為瀏覽器渲染網頁是從上往下，頁面是使用者能看到的也能直觀感受到的，而js程式碼是用戶看不到的，屬於「幕後」的東西， 把「幕後」的東西放到最下面，那麼用戶能看得見的頁面加載速度就會更快，讓用戶感覺頁面打開速度很快，提高使用者體驗。

• js一般會用於對頁面DOM的操作，如果將js程式碼放到頁面頂部， 基於瀏覽器從上往下載入的機制，有可能被操作的DOM節點還未加載完畢，JS就去操作DOM了，這明顯會導致出錯，放到頁面底部會保險一些。

主要考慮是第一條， 第二條現在為了百分百保證DOM樹渲染完畢執行JS， 基本上都用load偵測了。

推薦教學：《JS教學》

以上是為什麼要把JavaScript檔放在Html底部的詳細內容。更多資訊請關注PHP中文網其他相關文章！