JavaScript應該放在哪里？

Question

我已經做了一段時間的JavaScript（嗯，更像jQuery），我一直感到困惑的一件事是我應該將腳本放在<head>標記還是<body>標記中。。

如果有人可以澄清這個問題，那就太好了。 一個完美的例子。

Answer 1

谷歌和雅虎的最佳實踐表明，為了提高性能，應始終將javascript放在外部文件中，並在<body>關閉之前，使用位於html底部的<script>標簽將其鏈接到您的頁面。元件。

這使瀏覽器可以立即呈現整個頁面，而不必停止評估javascript。

Answer 2

您提到了三個地方：

在標簽中；
在HTML中； 和
在外部文件中。

讓我來解決每個問題。

最佳做法是在一個或多個外部文件中使用通用 Javascript，並且文件越少越好，因為加載的每個JS文件都會阻止頁面加載，直到加載該JS文件為止。

“普通”一詞非常重要。 這意味着您不想出於緩存原因將特定於頁面的Javascript代碼放入該外部文件中。 假設您有一個包含1000頁的網站。 每個頁面都有特定的JS代碼。 這可能是1000個不同的文件，也可能是一個執行很多不必要代碼的非常大的文件（例如，查找不在該特定頁面上但在999個其他頁面中的一個上的ID）。 這些結果都不好。

第一個對您的緩存沒有幫助。 第二個可能會導致可怕的頁面加載時間。

因此，您要做的就是將所有常用功能放在一個JS文件中，其中該JS文件僅包含函數。 在每個HTML頁面中，調用該頁面所需的JS函數。

理想情況下，您的JS文件也可以有效地緩存。 最佳實踐是使用遠期期貨HTTP Expires標頭和版本號，因此無論瀏覽器訪問多少頁面，JS文件僅由每個瀏覽器加載一次。 更改文件時，將更改版本號，並強制重新加載。 使用mtime（JS文件的最后修改時間）是一種常見的方案，它提供如下URL：

<script type="text/javascript" src="/js/script.js?1233454455"></script>

該mtime是自動生成的。 您的Web服務器配置為使用適當的Expires標頭提供JS文件。

這樣可以以最佳方式將外部文件和頁內腳本混合在一起（imho）。

您提到的最后一個地方是標簽中。 在這里，這取決於您使用什么JS庫和框架。 我是jQuery的忠實擁護者，它鼓勵使用簡潔的Javascript 。 這意味着（希望）您根本不會在標記中放入任何Javascript。 所以代替：

<a href="#" onclick="doStuff(); return false;">do stuff</a>

你做：

<a href="#" id="dostuff">do stuff</a>

使用Javascript：

$(function() {
  $("#dostuff").click(doStuff);
});

JavaScript應該放在哪里？

問題描述

2 個解決方案

解決方案1
11 已采納 2010-04-18 01:39:17

解決方案2
9 2010-04-18 01:48:08

JavaScript應該放在哪里？

問題描述

2 個解決方案

解決方案1 11 已采納 2010-04-18 01:39:17

解決方案2 9 2010-04-18 01:48:08

解決方案1
11 已采納 2010-04-18 01:39:17

解決方案2
9 2010-04-18 01:48:08