ソフトウェアエンジニアのブログ

暇つぶしに書いてます。他に技術的なことは[http://qiita.com/nsas454]に書いてますのでそちらも見てください。

JavaScriptでXMLHttpRequestを書いてみる

Ajaxアプリケーションを書く場合でも最近はライブライを使って記述することが多いと思います。したがって、直接JavaScriptXMLHttpRequestを記述することはまずないでしょう。私も直接書いたことはありません。Jqueryを使うか、Google Clouserを普段は使います。そうはいっても、直接JavaScriptでどうやってXMLHttpRequest書いたらいいのか知っておくのも大切だと思うので一般的な書き方をメモしておきます。
urlには通信先のURLを記述します。
readyStateの4が帰ってきたら通信が終了なので、そこでサーバからのレスポンスをstatusでチェックして条件に応じて処理をするようになります。
”読み込み中...”みたいな表記をさせたい場合は、readyStateが4になるまでの処理に追加しておけば大丈夫です。

以外に簡単ですね。

var req = new XMLHttpRequest();
req.onreadystatechange = function(){
  swich(req.readyState){
      case 1://open
      case 2://Sent
      case 3://Receiving
          break;
      case 4://Loaded  
         //xhr.status === 200
    }
};
req.open(‘GET’,‘url’,true)
req.sent(null);


Jqueryはもっと記述を簡単にできます。

$.ajax({
    url: '取得するXMLファイル',
    dataType: 'xml',
    success : function(data){
        //取得したファイルに対する処理
    }
})

機能についてはJavaScriptで記述したものと全く同じです。
Jqueryみたいなシンタックスシュガーを使うとコーディングが楽になりますね。