2012-04-24 21 views
2

私は数ヶ月間javascriptで開発してきました。私はすべてのスクリプトの冒頭に$(document).ready(function(){を使用しています。私は他の人々がスクリプトでこれを使用しないことに気づいたが、私はそれなしで私の仕事をすることはできないようだ。コードをきれいにしておきたいのですが、私のすべてのGoogle検索では、それを取り除く方法を理解できないようです。

私は、ページが読み込まれるとすぐにスクリプトを実行するようにブラウザに指示しますが、ページが読み込まれたときにスクリプトを実行するようにブラウザに明示的に指示する必要はありません?それとも、私のhtmlファイルでスクリプトがどこに置かれているのがよりグローバルな問題ですか?

+3

あなたのスクリプトは、右の前に 'を'タグスティック、あなたはあなたが(速記バージョン '$を使用することができます準備文書 –

+0

を必要はありませんあなたのすべてのコンテンツがロードされた後に.. function.(){'代わりに。 – j08691

答えて

7

おそらくdocument.ready必要としています。スクリプトは、まだそこにない要素をどのように操作できますか?

あなたはファイルの末尾にスクリプトを貼り付けた場合は、あなたがそれを必要としません。また、多くのJavascriptファイルの処理には時間がかかります(特に外部でホストされている場合)。それらをファイルの末尾に置くことは、しばしばspeeds up the page load timeです。

+1

最後にJavaScriptを置く練習 - すべてのブラウザで確実に動作する*私が知っていることは、技術的には*保証されていない*しかし、この時点では、ブラウザがこのように働かないように自殺するので、理論上の美徳の議論になります。 ]実用的なアプリケーション... –

+0

@pstこれはいくつかの[副作用]です(http://stackoverflow.com/questions/8717401/is-onload-necessary-when-javascript-is-at-the-bottom)更新されたブラウザでさえも – ajax333221

+0

@ ajax333221その回答には欠けているものがあります。 '

6

すべて$(document).ready(function() { ... });または$(function() { ... });はない操作のための準備ができて文書を待つです。スクリプトがインラインまたは<head />セクションにある場合は、$(document).ready(function() { ... });または$(function() { ... });を使用する必要があります。これは、JavaScriptがページに表示される順序で実行されるためです。

$(document).ready(function() { ... });または$(function() { ... });を廃止単に右閉じる</body>タグの前に、すべてのコンテンツの後にページの一番下までスクリプトを移動します。下部にスクリプトを置く

はとにかく本当にベストプラクティスです。このベストプラクティスと他のベストプラクティスについては、Html5BoilerplateYahoo! Best Practicesをご覧ください。それはロードする前に、あなたがDOMと対話しているので

+0

' ...、それは厳密にはtrueではありません。Document.ReadyはDOMがブラウザによって登録されるとすぐに起動します。 – Nope

+0

もう1つの良い方法は、あなたのHTMLの中にスクリプトを置くことではなく、ページ内のスクリプトを含むスクリプトファイルを参照することです控えめなスクリプトを使用すると、より洗練されたHTMLが得られます。 – Nope

+0

@FrançoisWahl - そうです、それは本当です、私は編集します。 1つのスクリプトファイルが実行される限り、それも真実であり、私が言及したリンクで議論されています。それでも、CDN(modernizr.js、jquery.js、jquery-ui.js)と2つのスクリプトファイルをローカル(plugins.jsとscript.js)から引き出す約2〜3つの外部スクリプトファイルを使用することができます。とにかくそれは私のやり方です。 –

1

$(document).ready()大会は、jQueryのの一部だけではなく、JavaScriptのです。彼らの「documentation on the ready functionから:

これは、jQueryのについて学ぶために最初のものです:あなたは、イベントがあなたのページで作業したい場合は、$(ドキュメント).ready()関数の中にそれを呼び出す必要があります。その中のすべては、DOMがロードされ、ページの内容がロードされるとすぐにロードされます。

そうです、それが必要とされます。 jQueryのは、しかし、このための速記が付属していませんので、あなたは、次の操作を行うことができます:

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

"JavaScriptだけではない"?どういう意味ですか? –

+0

@FlorianMargaine - '$(document).ready()'関数はjQueryによって提供され、jQuery自体はJavaScriptで実装されていますが、jQueryライブラリを含まないWebページではjQuery機能を使用できません。すべてのブラウザで動作するjQueryを持たない最もシンプルな同等のものは、普通のonloadイベントハンドラです。 – nnnnnn

+0

うん、私は知っているが、@ GStoの文章は "javascriptだけではない"ように見えるので、私はまだ落書きすべきかどうかについて躊躇している。 –

関連する問題