AJAX基礎まとめ

非同期jsとxml、ページ全体がリフレッシュされない場合にhttpリクエストと処理応答を送信
げんり
XMLHttpRequestオブジェクト、jsオブジェクト
高度なブラウザでは、直接new XMLHttpRequestが作成され、古いバージョンのIEでActiveXオブジェクトでnew ActiveXObjectが作成されます(「Microsoft.XMLTTP」)
リクエストの送信方法
メソッドの説明
open(method,url,async)
リクエストのタイプ、URL、およびリクエストを非同期で処理するかどうかを指定します.

method:リクエストのタイプ;GETまたはPOST

url:サーバ上のファイルの場所

async:true(非同期)またはfalse(同期)

send(string)
要求をサーバに送信します.

string:POST要求

にのみ使用する.
メソッドの説明
setRequestHeader(header,value)
要求にHTTPヘッダを追加します.

header:規定ヘッダの名称

value:規定ヘッダの値

フォームのようにデータをコミット

xmlhttp.open("POST","ajax_test.asp",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("fname=Bill&lname=Gates");

getAllResponseHeaders()

DOMString getAllResponseHeaders();

Returns all the response headers as a string, or null if no response has been received. Note: For multipart requests, this returns the headers from the current part of the request, not from the original channel.
getResponseHeader()

DOMString? getResponseHeader(DOMString header);

Returns the string containing the text of the specified header, or null if either the response has not yet been received or the header doesn't exist in the response.

Async=true

xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","test1.txt",true);
xmlhttp.send();

Async=false

    send        

xmlhttp.open("GET","test1.txt",false);
xmlhttp.send();
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;

属性の説明
responseTextは、文字列形式の応答データを取得する.
responseXMLは、XML形式の応答データを取得する.
属性の説明
onreadystatechangeは、readystatechangeプロパティが変更されるたびに呼び出される関数(または関数名)を格納します.
readyState
XMLHttpRequestのステータスが保存されています.0から4まで変化します.

0:要求未初期化

1:サーバ接続が確立されました

2:要求受信

3:要求処理中

4:要求が完了し、応答が完了した

.
status
200: "OK"
404:ページが見つかりません