JavaScript - Ajaxのデータ(XML(jQuery))

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

開発環境

• OS X Lion - Apple(OS)
• Safari、Firefox + Firebug (Webプラウザ、プラグイン)
• BBEdit - Bare Bones Software, Inc.(Text Editor)
• プログラミング言語:JavaScript
• JavaScript Library: jQuery

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

その他参考書籍

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

1.

コード(BBEdit)

var $d0 = $('#d0');
$d0.text("");
$.ajax({
    url: 'http://mkamimura.com/kamimura_blog/learning_javascript/sample1.xml',
      type: 'GET',
      dataType: 'xml',
      success: function(data, textStatus, xhr) {
          var $div = $(document.createElement('div')),
              $h = $(document.createElement('h3')),
              $p = $(document.createElement('p')),
              $ul = $(document.createElement('ul')),
              $recipe = $(data).find('recipe'),
              title = $recipe.find('title').text(),
              ingredients = $recipe.find('ingredient'),
              instruction = $recipe.find('instruction').text();
          $h.text(title);
          $div.append($h);
          ingredients.each(function(index) {
              var $li = $(document.createElement('li'));
              $li.append($(this).text());
              $ul.append($li);
          });
          $div.append($ul);
          $p.text(instruction);
          $div.append($p);
          $d0.html($div);
      },
      error: function(xhr, textStatus, errorThrown) {
        $('#d0').text("エラー");
      }
});