)ver1.0〜※htmlの構成が読み込まれたら実行されます。画像の読み込みなどには関与しません。機能htmlファイル内に記述されたDOM(htmlの構成要素)がすべて読み込まれた(操作可能になった)時に引数のfunctionを実行します。jQuery(function)も同じ機能を持ちます。こちらの方が簡単に記述できるのでこちらを利用することの方が多いでしょう。勘違いしやすいのは、画像などの読み込みは関係ない点です。htmlの構成要素が操作可能になったときにfunctionを実行します。loadメソッドを利用してください。解説ほとんどjQueryはDOMの読込が完了してからでないと利用できないjQueryでページ内の要素を操作するときには、操作したい要素が読み込まれている必要があります(タグの部分が必要なだけで、付随する画像などが読み込まれている必要はありません)。DOMが読み込まれる前にjQueryを実行しても機能しません。サンプル(ready/01.html)を開いてbody内には何も無いことを確認して下さい。appendToメソッドを利用してdiv要素をbody内に追加します。css設定でdiv要素は水色の正方形で表示するようにしてあるので、追加されればすぐに確認できます。jQuery("<div/>").appendTo("body");しかし実際は、ブラウザ上に何も表示されません。これはDOM(このサンプルではbody要素)が読み込まれる前に、body要素を操作しようとして失敗するためです。機能させるためにはDOM(このサンプルではbody要素)の読込が完了してから、処理を実行しなければなりません。DOMを操作しないような処理(例えばXMLファイルを読込む等)は、このjQueryメソッドを利用する必要はありません。タイトルが「すべての」ではなく「ほとんどの」となっています。DOMの読込を完了したときの処理を設定readyメソッドを利用すれば、DOMの読込を完了してから処理が実行できます。サンプル(ready/02.html)を開いてbody内の構成はready/01.html同様に何もないことを確認してください。jQueryは以下の様に記述され、readyメソッドの引数にfunctionの「initFunc」が設定されています。ページ全体のDOMの読込を確認するので、セレクタにはdocumentを設定します。$(document).ready(initFunc);readyメソッドの引数に設定するFunctionは以下の様な構文になっています。引数(イベントオブジェクト)を受け取ります。DOM要素の読込が完了したら実行したい処理を{}の中に書きます、何かをreturnする必要はありません。イベントオブジェクトは別項にまとめてあるので、そちらを確認してください。任意の名前(イベントオブジェクト){DOM要素の読込が完了したら実行したい処理}サンプルready/02.htmlで利用したinitFuncは以下の様になっており、サンプルready/01.htmlの処理と同じになっています。initFunc(){jQuery("<div/>").appendTo("body");}これで、すべてのDOMの読込が完了したら(htmlの構成要素が操作できる状態になったら)initFuncを実行して、body要素にdiv要素を追加します。結果として正常に機能し、ページを開くと水色のdiv要素が表示されます。イベントのfunction設定は、無名関数を利用することが多いです。{$("<div/>").appendTo("body");});関連項目jQuery(function)も同じ機能を持ちます。こちら方が記述が簡単なので、こちらを利用した方がよいでしょう。メモfunctionの引数に$を設定readyメソッドに設定するfunctionの引数に「$」を設定すると、function内で「$」は必ずjQueryを指すようになります。これは他のjavaScriptライブラリと合わせて利用する際などに利用します。function内での$がjQueryに固定されるので、他のプラグインと混在させるのには向きません。jQuery.noConflict()を利用したほうが良いでしょう。サンプル(ready/test01.html)を開いてjQueryを確認してください。他のライブラリを利用する代わりに以下の様に「$」に別の値(ここでは10)を設定しています。10;そのため、続く以下の処理で「$」がjQueryではないため正常に機能しません(水色のdiv要素が表示されません)。{$("<div/>").appendTo("body");});次にサンプル(ready/test01b.html)を開いてjQueryを確認してください。以下の様にreadyメソッドの引数に設定したfunctionの引数に「$」を設定している以外は、すべてサンプルready/test01.htmlと同じです。※2行目先頭のjQueryは「$」にしてはいけません。この時点では「$」は10です。{$("<div/>").appendTo("body");});この場合はreadyメソッドの引数に設定したfunction内では、必ず「$」がjQueryを指すため、ready/test01.htmlと異なり、正常に機能します(水色のdiv要素が表示されます)。jQuery(function)も利用できます。