Ajaxの基本の詳細な説明

Ajaxの主な機能は、ブラウザのXMLHttpRequestオブジェクトを使ってサーバーを非同期にアクセスすることです：ブラウザから小さなデータを送信し、サーバーとやり取りを行い、サーバーから小さなデータを受信し、クライアントの一部のページを更新します。

1.XMLHttpRequestオブジェクトをインスタンス化します

var request;
if (window.XMLHttpRequest){
 request=new XMLHttpRequest();
}
else{
 request=new ActiveXObject("Microsoft.XMLHTTP");
 //ie互換5 6
}

2.XMLHttpRequestのメソッドでサーバーにリクエストを送信します

request.open("POST",get.php,true);//リクエスト
//httpのヘッダ情報を設定し、サーバーにsendキーワード対形式でフォームを送信する旨を伝えます
request.setRequestHeader("Content-Type","application/x-www-form-urlencoded);
//POSTではContentを設定する必要があります-Typeの値はopenとsendの間に設定されます
request.send("name=王二狗&sex=男");//sendメソッドを使ってサーバーに送信します

3.応答を取得する方法

responseText 文字形式の応答データを取得します
responseXML XML形式の応答データを取得します
statusおよびstatusTextはHTTPステータスコードを数字とテキストの形式で返します
getAllResponseHeader() 全ての応答ヘッダを取得します
getResponseHeader() 响应中的某个字段的值を查询します

4readyState属性の変化を監視することは非常に重要です。

　　　 0 ではリクエストが初期化されていない、openがまだ呼び出されていません。

　　　 1 サーバー接続が確立され、openが呼び出されました。

　　　 2 リクエストが受け入れられ、ヘッダー情報を受け取りました。

　　　 3 リクエストが処理中で、応答体を受け取りました。

　　　 4 リクエストが完了し、応答が準備できており、応答が完了しました。

//readyStateが変化した場合にトリガーされます。
//onreadystatechangeイベントを通じてreadyState属性の変化を判断します。
request.onreadystatechange=function(){
 if(request.readyState===4&&request.status===200){
 //例えば、応答データrequest.responseTextを取得するなどの行為を行います。
 }
}

5完全なXHR

var request=new XMLHttpRequest();//1XHRオブジェクトを生成します。
request.open("GET","get.php?number=" +フォームに送信する必要があるデータ,true);//2openメソッドを呼び出します。
//これはPOSTリクエストの場合であれば、sendにデータを含むオブジェクトが送信されます。
request.send();//データを送信します。
request.onreadystatechange=function(){ //3サーバーが正しく応答しているかの監視判定を行います。
 if(request.readyState===4&&request.status===200){
 //4例えば、サーバーの応答内容request.responseTextを取得するなどの行為を行います。
 }
}

これで本文の全てが終わりました。本文の内容が皆様の学習や仕事に役立つことを願っています。また、ナイアラガイドのサポートをどうぞ多くお願いします。

声明：本文の内容はインターネットから取得しており、著作権者に帰属します。インターネットユーザーにより自発的に貢献し、自己でアップロードされたものであり、本サイトは権利を保有しておらず、編集は行われていません。著作権侵害を疑う内容がある場合は、以下のメールアドレスにご連絡ください：notice#oldtoolbag.com（メールを送信する際には、#を@に変更してください。告発を行い、関連する証拠を提供してください。一旦確認ができ次第、本サイトは侵害を疑われる内容をすぐに削除します。）