2010-01-08 23 views
1

我們可以用3種方式放置JavaScript?如何判斷哪些javascript可以放在底部或哪些必須放在<head>?

  1. 在身體外部文件
  2. <head>
  3. <body>

所有的方法都是由W3C有效嗎?

那麼如何判斷JavaScript應放置在底部還是必須位於<head><body>

  1. 我見過的JavaScript許多網站
  2. <head>
  3. 作爲外部JS,
  4. 之前</body>
  5. 一段時間<body>....<body> 例如在任何地方:在任何其他XHTML 標籤/代碼將影響 與JavaScript代碼。

更新: 我看到大部分的人使用谷歌分析代碼作爲一個內嵌的JavaScript在底部?

回答

1

在大多數情況下,Javascript應該作爲外部文件,以允許緩存並避免在每次頁面加載時重新下載完全相同的100 + -line腳本。 (另一方面,如果它是一個腳本,你只希望用戶能看到一次,那麼內聯是好的。)

不管它頭或身體是否真的是你的選擇,雖然Yahoo recommends the bottom of the body for performance

+0

把它放在底部的問題是當你需要在頁面完成加載之前加載javascript。示例是基於javascript的菜單。您需要菜單在頁面完全加載之前工作。 – Martin 2010-01-08 04:01:09

+0

@Martin以無JavaScript腳本的方式編寫菜單。有可用性測試和合規性這樣的事情。 – Tracker1 2010-01-08 10:19:49

6

在我的編碼我遵循以下規則,關於JS組織:

  1. 任何JS不是時間敏感的和/或在文檔加載後運行得到放入外部js文件幷包含在head
  2. 任何需要儘快運行的JS放在適當的DOM(例如。如果你想一些代碼,只要必要元件裝入到位的代碼正下方的最後依賴的元素)
  3. 像尼爾森/谷歌的任何外部跟蹤庫在底部剛剛閉幕body tag之前去運行
0

如果您擔心頁面加載時間這個google article最小化您的有效載荷大小可能會有所幫助。我已經鏈接到有關推遲加載JavaScript的部分。不完全是你所要求的,但可能派上用場。

其實,http://code.google.com/speed/只是簡單的方便!

0

我通常會盡我所能將外部js文件放入。這種情況的主要例外是在加載時將信息注入頁面服務器端。我傾向於將不是特定於一個頁面的所有內容都推送到庫/站點js文件中。如果您不需要內聯腳本(即:document.write),那麼最好在關閉正文標籤之前將腳本推到底部(請參閱YSlow和雅虎關於爲什麼的研究)。

  1. 如果網頁/腳本不會NEED文件撰寫,把它在底部。
  2. 如果是的話需要 document.write評估原因。
  3. 如果它可以很容易地外化(成一個單獨的.js)做到這一點。
  4. 如果它不是特定於一個頁面,請將其放入多個頁面使用的.js中。
  5. 儘可能將自定義網站腳本合併到一個.js文件中。
  6. minify/reduce說.js並儘可能使用http壓縮。

造成這種情況的主要原因:從你的腳本

  1. 獨立您的標記。
  2. 將您的標記與腳本分開。
  3. 將腳本與腳本分開(儘可能與css相同)
  4. 創建可重複使用的腳本包括減少服務器請求。
  5. 減少服務器請求
  6. 減少傳輸文件的時間。
相關問題