)ver1.0〜・url:読む込むデータのurl・object:サーバに送るデータを設定。値の型はobjectオブジェクト。・function:通信後に実行される処理を設定。以下の引数を受け取る・第1引数:取得したデータ・第2引数:状態(success、error、notmodified、timeout、parsererror)・第3引数:XMLHttpRequestオブジェクト機能jQueryオブジェクトで指定した要素にサーバーから受信した情報を「html」コンテンツとして読み込みます。第2引数にobjectオブジェクトを設定することで、サーバーにデータを送信することができます。第3引数にfunctionを設定することで、読込が完了したら処理を実行することができます。このfunctionは引数として色々な情報を受け取ることができます。loadメソッドはphpなどサーバーサイドのプログラムと連携することが可能だと思います(例えば「第2引数のobjectオブジェクトで渡したデータによって、返されるデータが変更される」など)。私がサーバーサイドの知識を持っていないため、サーバーサイドとの連携に関する説明はしていません。第2引数で渡すデータがobjectオブジェクトの場合はpost形式で送信され、それ以外の場合はget形式で送信されます。解説htmlコンテンツを取得するまずは読み込むデータを確認します。読み込むデータの文字コードは「UTF-8」にしなければなりません。ブラウザで開いた際に文字化けした時は、文字コードを変更して確認して下さい。読込データ(data/simple.txt)には2バイト文字(日本語)で2行のテキストデータになっています。1行目末には改行タグ(<br/>)が設定してあります。loadメソッドは読み込んだデータをhtmlコンテンツとして扱うので、このようなタグが利用できるのです。サーバ上に配置した<br/>シンプルなテキストデータですサンプル(load/01.html)を開いてbody内にdiv要素とbutton要素があることを確認して下さい。jQueryは以下の様に記述され、buttonをクリックするとloadメソッドを利用して、セレクタで指定したdiv要素に読込データ(data/simple.txt)をhtmlコンテンツとして読み込みます。$("button").click(function(){$("div").load("../data/simple.txt");});結果として、buttonをクリックするとdiv要素内に読み込んだデータが表示されます。htmlコンテンツとして表示するので改行タグ(<br/>)も機能します。通信が成功したか否かをチェックする引数に設定するfunctionを利用すると、データの読込の失敗などをチェックすることができます。functionでは以下の様に3つの引数が渡されます。第1引数の「受信データ」は読み込まれた内容になります。第2引数の「状態」は読込に成功すれば「success」、失敗すれば「error」、以前読み込んだ時から更新されていなければ「notmodified」、タイムアウトで「timeout」、パースに失敗すると「parsererror」が送られてきます。XMLHttpRequest){読込が完了したら実行したい処理}サンプル(load/02.html)を開いてbody内の構成がload/01.htmlと同じ事を確認して下さい。jQueryもほとんど同じで、以下の様にloadメソッドの引数にfunction「loadFunc」が追加されています。myStatus)を受け取っています。myDataに渡されるデータは読み込まれる「data/simple.txt」の内容と同じなので、ここでは利用しません。appendメソッドを利用してbody内に表示します。success」と表示されます。読込に失敗した例も紹介します。サンプル(load/02b.html)を開いてloadメソッドのurlが以下の様に変更されているのを確認して下さい。サーバー上に「no.txt」というデータは存在しないので、読込に失敗します。error」と表示されることを確認して下さい。ここまでのサンプルは分かりやすい様に、functionを作成してからloadメソッドに設定しました。loadメソッドの引数に無名関数として設定することのほうが一般的なので、最後に紹介しておきます。myStatus);});});関連項目loadメソッドは強制的にjQueryオブジェクトで指定した要素にデータが表示されます。jQuery.getメソッドを利用してください。loadメソッドがありますが、全く異なるメソッドです。構文が異なるので混同しないと思いますが注意しましょう。メモ特定の部分を抜き出して読み込むlaodメソッドは読み込むデータの一部だけを読み込むことができます。読込データ(data/simple2.txt)を開いて、以下の様にid属性がtestと設定されたspan要素が追加されていることを確認して下さい。id="test">このテキストはid属性がtestのspan要素に囲まれています。</span>続いてサンプル(load/test01.html)のjQueryで以下の部分を確認して下さい。引数のurl内で読み込むデータのファイル名の後に「半角スペースを挟んで」読み込みたいセレクタ(ここではid属性がtest)を記述しています。#test");});こうすることで特定の部分だけを読み込むことができます。実際にbuttonをクリックするとid属性がtestの部分しか読み込まれません。XMLの苦手な方に良いかも上記のテクニックを利用すれば、1つの外部データから簡単に好きな情報を読み込むことができます。読み込むデータを確認して下さい。読込データ(load/test.txt)には以下の様に3つのspan要素があり、それぞれid属性にage,name,addressが設定されています。id="address">東京</span>続いて読み込むサンプル(load/test02.html)を開いてbody内の構成を確認して下さい。buttonが3つあり、それぞれにidが設定されています。読み込むデータのid名と対応させているのがポイントです。id="address">住所</button>続いてjQueryが以下の様に記述されている事を確認して下さい。ポイントは2行目でクリックされた要素のid(this.id)を足している部分です。これでボタンのidに応じたデータを読み込むことができます。その前にある半角スペースと#も忘れないで下さい。this.id);});結果として、年齢のbuttonをクリックすれば18と表示され、名前のbuttonをクリックすれば太郎と表示されます。