JavaScript - Ajaxのデータ - XMLかJSONか(JSON(JSON.parse(data))

初めてのJavaScript 第2版
Shelley Powers (著)
武舎 広幸、武舎 るみ (訳)

開発環境

• OS X Lion - Apple(OS)
• Safari (Webプラウザ)
• BBEdit - Bare Bones Software, Inc.(Text Editor)
• Script言語:JavaScript
• JavaScript Library: jQuery

『初めてのJavaScript 第2版』(シェリー・パワーズ著(Shelley Powers著)、武舎 広幸+武舎 るみ訳、オライリー・ジャパン、2009年、ISBN978-4-87311-425-5) の15章(Ajaxのデータ - XMLかJSONか)練習問第15-2.を解いてみる。

その他参考書籍

• JavaScript 第6版
• JavaScriptリファレンス 第6版
• JavaScriptクックブック
• jQueryクックブック

15-2.

コード(BBEdit)

$('#pre0').html('');
$('#d0').html('');
$('#pre0').text("通信開始\n");
$.ajax({
    url: 'http://mkamimura.com/kamimura_blog/learning_javascript/sample1.txt',
      type: 'GET',
      dataType: 'json',
      complete: function(xhr, textStatus) {
          $('#pre0').append("通信終了\ntextStatus:" + textStatus + "\n");
      },
      success: function(data, textStatus, xhr) {
          $('#pre0').append("データの取得成功\n");
          var recipe = $(document.createElement('div'));
          recipe.id = "recipe";
          var title = $(document.createElement('p3'));
          title.append(data['title']);
          recipe.append(title);
          var ul = $(document.createElement('ul'));
          var ingredients = data['ingredients'];
          for (var i = 0, max = ingredients.length; i < max; i += 1) {
              var li = $(document.createElement('li'));
              li.append(ingredients[i]['ingredient']);
              ul.append(li);              
          }
          recipe.append(ul);
          var p = $(document.createElement('p'));
          p.append(data['instruction']);
          recipe.append(p);
          $('#d0').append(recipe);
      },
      error: function(xhr, textStatus, errorThrown) {
        $('#pre0').append("データの取得失敗\n" +
        "textStatus: " + textStatus + ", errorThrown: " + errorThrown + "\n");
      }
});