XMLHttpRequestオブジェクトは、サーバとデータを交換するために使用されます。
要求をサーバーに送信
サーバーに要求を送信するために、我々は使用open()とsend() XMLHttpRequestオブジェクトのメソッドを：
xhttp.open("GET", "ajax_info.txt", true);
xhttp.send();| 方法 | 説明 |
|---|---|
| open(method, url, async) | 要求のタイプを指定します。 method ：要求のタイプ： GETまたはPOST url ：サーバ（ファイル）の場所 async ： true （非同期）またはfalse （同期） |
| send() | （のために使用するサーバーにリクエストを送信しますGET ） |
| send(string) | （のために使用するサーバーにリクエストを送信POST ） |
GETやPOST ？
GETより単純で高速であるPOST 、ほとんどの場合に使用することができます。
しかし、常に使用しPOST際にリクエストを：
- キャッシュされたファイルは、（サーバー上のファイルやデータベースを更新）オプションではありません。
- サーバーに大量のデータを送信（ POSTないサイズの制限がありません）。
- （未知の文字を含めることができます）、ユーザー入力を送信する、 POSTより堅牢で安全であるGET 。
GETリクエストを
シンプルなGETリクエスト：
上記の例では、キャッシュされた結果を得ることができます。 これを回避するには、ユニークな追加ID to the URL: ID to the URL:
あなたが情報を送信する場合GETメソッド、URLに情報を追加します。
POSTリクエスト
シンプルなPOSTリクエスト：
するにはPOST 、HTMLフォームのようにデータを追加するHTTP header用いてsetRequestHeader() あなたが送信したいデータを指定しsend()メソッドを：
例
xhttp.open("POST", "ajax_test.asp", true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send("fname=Henry&lname=Ford"); »それを自分で試してみてください | 方法 | 説明 |
|---|---|
| setRequestHeader(header, value) | リクエストにHTTPヘッダーを追加します。 header ：ヘッダー名を指定します value ：ヘッダ値を指定します |
URL - サーバー上のファイル
urlのパラメータopen()メソッドは、サーバー上のファイルへのアドレスです。
xhttp.open("GET", "ajax_test.asp", true);ファイルは.aspファイルと（バック応答を送信する前に、サーバー上のアクションを実行することができます）の.phpなどの.txtファイルおよび.xml、またはサーバーのスクリプトファイルと同様に、ファイルの任意の種類とすることができます。
非同期- TrueまたはFalse ？
AJAXは、非同期JavaScriptとXMLの略で、AJAXのように動作するXMLHttpRequestオブジェクトのために、 asyncのパラメータopen()メソッドをtrueに設定する必要があります。
xhttp.open("GET", "ajax_test.asp", true);非同期要求を送信すると、Web開発者のための巨大な改善です。 サーバー上で実行されるタスクの多くは、非常に時間がかかります。 AJAXの前に、この操作は、アプリケーションがハングまたは停止する可能性があります。
AJAXを使用すると、JavaScriptは、サーバーの応答を待つ必要はありませんが、その代わりにすることができません：
- サーバーの応答を待っている間に他のスクリプトを実行します
- 応答を扱うときの応答の準備ができて
Async=true
クラス= "notranslate"非同期=真を使用する場合、応答はonreadystatechangeイベントで準備ができたときに実行する関数を指定します。
例
xhttp.onreadystatechange = function() {
if (xhttp.readyState == 4 && xhttp.status == 200) {
document.getElementById("demo").innerHTML = xhttp.responseText;
}
};
xhttp.open("GET", "ajax_info.txt", true);
xhttp.send(); »それを自分で試してみてください あなたは後の章でonreadystatechangeについての詳細を学びます。
Async=false
使用するにはasync=false 、第三のパラメータを変更するopen() falseにする方法：
xhttp.open("GET", "ajax_info.txt", false);使用してasync=falseお勧めしませんが、いくつかの小さな要求のために、これは大丈夫であることができます。
サーバーの応答の準備ができるまでJavaScriptは、実行を継続しないことを覚えておいてください。 サーバーがビジー状態または低速である場合、アプリケーションがハングまたは停止します。
注：使用するとasync=false 、onreadystatechange関数を記述しないでください-直後のコードを入れてsend()ステートメント：
例
xhttp.open("GET", "ajax_info.txt", false);
xhttp.send();
document.getElementById("demo").innerHTML = xhttp.responseText; »それを自分で試してみてください