AJAXの仕組みでXMLHttpRequestオブジェクトの使い方

AjaxでXMLHttpRequestオブジェクトは，次のように使われます：

1. XMLHttpRequestオブジェクトを作成する：

var xhr = new XMLHttpRequest();

1. リクエストメソッドとURLの設定：

xhr.open('GET', 'example.com/data', true); // true表示使用异步请求

1. リクエスト結果を処理するためのコールバック関数を設定します。

xhr.onreadystatechange = function() {
if (xhr.readyState === XMLHttpRequest.DONE) { // 请求完成
if (xhr.status === 200) { // 请求成功
console.log(xhr.responseText); // 处理返回的数据
} else {
console.log('请求失败');
}
}
};

1. リクエストを送信:

xhr.send();

上記コードにおいて、xhr.onreadystatechangeはリクエストの状態変化時に呼び出されるイベントハンドラ関数です。リクエスト完了時（xhr.readyStateが4）に、 xhr.statusでリクエストの成功／失敗を判定し、成功した場合は xhr.responseTextで応答データを格納できます。

XMLHttpRequestオブジェクトを利用する際には、xhr.setRequestHeader()メソッドでリクエストヘッダ情報を設定したり、xhr.getAllResponseHeaders()メソッドでサーバーから返されるヘッダ情報を取得したりできます。