開発環境
- Microsoft Windows 7 Home Premium (OS)
- Internet Explorer 9 (Webプラウザ)
- Microsoft Visual Web Developer 2010 Express Edition (IDE)
- Script言語:JavaScript
- JavaScript Library: jQuery
『初めてのJavaScript 第2版』(シェリー・パワーズ著、武舎広幸+武舎るみ訳、オライリー・ジャパン、2009年、ISBN978-4-84311-425-5)の15章(Ajaxのデータ - XMLかJSONか), 練習問題2を解いてみる。
15-2.
大雑把には以下のような感じ?(前問のコードをJSONフォーマットにあわせて少し修正した感じ)
コード
var xmlhttp = new XMLHttp();
function getXmlHttpRequest() {
xmlhttp.open("GET", url, true);
xmlhttp.onreadystatechange = getRecipe;
xmlhttp.send(null);
}
function getRecipe() {
if (xmlhttp.readyState == 4
&& xmlhttp.status == 200) {
var recipe = JSON.parse(
xmlhttp.responeseText);
var div= document.createElement("div");
var h3 = document.createElement("h3");
var title = document.createTextNode(
recipe.title);
h3.appendChild(title);
div.appendChild(h3);
var ul = document.createElement("ul");
var ingredients = recip.ingredients;
for (var i = 0;
i < ingredients.length; i++) {
var li = document
.createElement("li");
var ingredient = document
.createTextNode(
ingredients[i]
.ingredient);
li.appendChild(ingredient);
ul.appendChild(li);
}
div.appendChild(ul);
var p = document.createElement("p");
var instruction = document
.createTextNode(
recipe.instruction);
p.appendChild(instruction);
div.appendChild(p);
$('body').append(div);
}
}
合わせて読んでいる書籍。
- 14章でPHPとJavaScriptを組み合わせたWebアプリケーションが登場したので『初めてのPHP
& MySQL 第2版』(Micbele E. Davis、Jon A. Phillips 著、西沢 直木 訳、オライリー・ジャパン、2008年、ISBN978-4-87311-365-4)
- JavaScriptのライブラリーを活用できるようになるために『jQueryクックブック』(jQuery Community Experts 著、株式会社クイープ 訳、オライリー・ジャパン、2010年、ISBN978-4-87311-468-2)
- JavaScript、APIを使って遊ぶために『Google Maps Hacks 第2版 ―地図検索サービスをもっと活用するテクニック』(Rich Gibson, Schuyler Erle 著、武舎 広幸、福地 太郎、武舎 るみ 訳、オライリー・ジャパン、2007年、ISBN978-4-87311-341-8)
- HTML5について学習するために『入門
HTML5』(Mark Pilgrim 著、矢倉 眞隆 監訳、水原 文 訳、オライリー・ジャパン、2011年、ISBN978-4-87311-482-8)
PHPの学習が止まったまま(というかほとんど進んでいない)だけど、そろそろ再開しようか検討中。
前の周では少しずつjQueryを使ってみたけど、今回はもっとjQueryを活用していく計画!
0 コメント:
コメントを投稿