2012-04-24 98 views
2

我一直在使用javascript開發幾個月,並且在所有腳本開始時我一直使用$(document).ready(function(){。我注意到其他人不會在他們的腳本中使用它,但如果沒有它,我似乎無法得到我的工作。我想保持我的代碼更清潔,但對於我所有的谷歌搜索,我似乎無法弄清楚如何擺脫它。

我知道它告訴瀏覽器在頁面加載後立即執行我的腳本,但是我可以設置全局的東西,這樣我就不需要明確告訴瀏覽器在頁面加載時執行每個腳本?或者,它是腳本所在的html文件中更多的全局性問題?

+3

堅持腳本標記權之前'',你不應該需要 – 2012-04-24 21:12:16

+0

文件準備就緒可以使用簡寫'$(函數(){''而不是。 – j08691 2012-04-24 21:14:46

回答

7

您需要document.ready可能是因爲您在加載之前正在與DOM進行交互。腳本如何操作那些還沒有的元素?

如果您將腳本粘貼到文件末尾,則不需要它。對於大量的Javascript文件這樣做也是一個很好的做法,因爲它們可能需要一定的時間來處理(特別是如果它們是在外部託管的話)。把它們放在文件的末尾通常爲speeds up the page load time

+1

將JavaScript放在最後的做法 - 哪些*可靠地在所有瀏覽器中工作? *我知道 - 在技術上*不*保證。然而,在這一點上,因爲瀏覽器會自殺而不是以這種方式工作,這歸結於理論美德的爭論,而不是[必然]實際應用... – 2012-04-24 21:37:17

+0

@pst這是一些[副作用](http://stackoverflow.com/questions/8717401/is-onload-necessary-when-javascript-is-at-the-bottom),即使存在即使在更新的瀏覽器上也是如此 – ajax333221 2012-04-24 21:52:30

+0

@ ajax333221那個答案有......缺少的答覆。'

6

全部$(document).ready(function() { ... });$(function() { ... });確實在等待文檔準備好進行操作。如果您的腳本內聯或在<head />部分中,則應該使用$(document).ready(function() { ... });$(function() { ... });,否則JavaScript按其在頁面上的顯示順序執行。

廢除$(document).ready(function() { ... });$(function() { ... });,只需將您的腳本到頁面底部後,您所有的內容,收盤</body> tag之前。

無論如何,將腳本放在底部實際上是最佳實踐。對於這個和其他最佳實踐,我建議你看看Html5BoilerplateYahoo! Best Practices

+0

'......在所有內容加載完成後...... ..這並非嚴格意義上的,Document.Ready只要DOM被瀏覽器註冊就會觸發,並不意味着所有你的內容是被加載的,通常情況下,當document.ready激活時,圖像還沒有被加載 – Nope 2012-04-24 21:32:38

+0

另一個好的做法是不要在你的html中有任何腳本,而是引用一個包含你的頁面腳本的腳本文件。使用不顯眼的腳本會導致更清晰的Html。 – Nope 2012-04-24 21:37:32

+0

@FrançoisWahl - 對,沒錯,我會編輯。就1腳本文件而言,這也是如此,並在我提到的鏈接中進行了討論。即使如此,您仍然可以使用大約2或3個從CDN(modernizr.js,jquery.js,jquery-ui.js)提取的外部腳本文件,然後在本地2個腳本文件(plugins.js和script.js)。無論如何,我就是這麼做的。 – 2012-04-24 21:50:31

1

$(document).ready()約定是jQuery的一部分,不僅僅是JavaScript。從他們的」 documentation on the ready function

這是瞭解jQuery的第一件事:如果你想要一個事件,您的網頁上工作,你應該把它叫做$(文件)。就緒()函數中。一旦DOM被加載並且在加載頁面內容之前,它內部的所有東西都會加載。

所以是的,它是必需的。 jQuery的不來與這個簡寫的,所以你可以做到以下幾點:

$(function() { 
    //jquery code 
}; 
+0

「不僅僅是JavaScript」?你什麼意思? – 2012-04-24 21:22:54

+0

@FlorianMargaine - $(document).ready()'函數是由jQuery提供的,而jQuery本身是用JavaScript實現的,你顯然不能在不包含jQuery庫的網頁上使用jQuery特性。沒有jQuery的最簡單的等價物可以在所有瀏覽器中使用,它是一個普通的'onload'事件處理程序。 – nnnnnn 2012-04-24 21:45:45

+0

是的,我知道,但@ GSto的句子使它看起來像「不僅僅是javascript」,這就是爲什麼我仍然猶豫是否應該downvote:p – 2012-04-24 21:55:32

相關問題