我應該在哪個頁面上包含JavaScript？

Question

我正在構建一個Rails應用程序，看起來常見的做法是在頁面頂部列出javascript_include_tags。

它會使瀏覽器在加載文檔之前加載JavaScript，從而使可見元素加載時間更長嗎？

謝謝。

Answer 1

看起來有些答案是正確的，但沒有總結這一切：

• 如何防止加載的JavaScript加載其他元素？簡單的說，就在關閉</body>標籤之前。這通常意味着您的HTML頁面結束前的幾個字符。
• 將所有的JavaScript放在外部.js文件中。爲什麼？這樣即使HTML頁面發生變化，瀏覽器也可以緩存這些文件。
• 將所有JavaScript文件合併並縮小爲一個。爲什麼？由於客戶端發出的HTTP請求越少，頁面加載速度越快。

而且，你不必在意$(document).ready()或window.onload，因爲你所有的HTML元素將JavaScript文件（也就是，如果你把JS文件收盤</body>標籤前右）之前被加載。

Answer 2

據我在網上閱讀，最佳做法加載身體標記底部的JavaScript文件。這使得在執行javascript之前幾乎所有的東西都會被加載，這通常可以防止訪問在頂部加載腳本時可能不存在的項目的問題。

Answer 3

關於網頁性能的雅虎發佈建議將它們包括在頁面底部（Source），因爲如果它們位於頂部，它們可以阻止其他依賴項的並行下載。

Answer 4

這是一個好主意，使用外部JS文件，並縮小它的內容。

• 頁面http://www.quirksmode.org/js/placejs.html

底部也是一個選擇像約翰·費舍爾說。

如果使用jQuery，無論如何使用$()或$(document).ready(function()它確保在嘗試使用JS函數之前加載頁面DOM。

Answer 5

而不是嵌入在其標記中的行爲，嘗試通過將它移動到一個腳本塊在網頁的部分，所述 文檔主體的範圍之外偏析腳本 ，如下所示：

<script type="text/javascript"> 
window.onload = function() { 
document.getElementById('testButton').onclick = function() { 
document.getElementById('xyz').style.color = 'red'; 
}; 
}; 
</script> 

由於性能方面的原因，腳本塊也可以放置在文檔正文的底部 ，儘管現代瀏覽器使得性能差別不大。重要的概念是避免將行爲嵌入結構元素中。