|
- 2008/02/24 21:38Ajax sample011で使用したプログラムの解説。
- 今回は sample011 で使用した Ajax プログラムについて
、解説します。実際にプログラムを動かしながら解
説を読むと理解が深まります。DOM を使って要素数を
調べて、子要素を削除しているところがポイントで
す。■index.html側(1)新しい JavaScript の外部ファイルを
読み込む部分を追加しました。<script type="text/ja
vascript" src="city.js"></script>(2)タイト
ルを変えました。... [続きを読む]
-
|
- 2008/02/24 17:09Ajax sample011の動作確認をしてみる。
- 前回に作成した Ajax プログラムの動作を確認してみましょう。このプログラムは、都道府県を切り替えたら、自動的に市町村が変わるというものです。使い方をマスターすれば、いろいろ応用範囲が広がります。プログラムがまだの方は一つ前のステップをご覧ください。プログラムの準備ができたら、Webサーバーを起動して動作を確認します。【1】C:phpdev にある「2K-NT-XP-phpdev_start.bat」をダブルクリックして、phpdev を起動し [続きを読む]
-
|
- 2008/02/24 15:24Ajax 都道府県から市町村を絞り込んで表示する方法。
- 今回は都道府県を選択すると、該当する市町村の一覧が表示できる Ajax プログラムについて説明します。全国に都道府県は 47 しかありませんが、市町村は 1900 を超えます。レコードを全件表示していては大変です。そこで「URLにパラメータを渡すと、該当する市町村のリストをXMLで返す」というWebサービスを私が作りました。http://ws.bzen.net/pgtop/GetCity.php?prefCd=1prefCd=1 の数字を 1〜47 の範囲で変更すると、XML... [続きを読む]
-
|
- 2008/02/23 23:14Ajax sample010で使用したプログラムの解説。
- 今回は sample010 で使用した Ajax のプログラムについて、詳しく解説します。 DOM(ドム:Document Object Model) を使っている部分を重点的に説明します。「.innerHTML」を使った時と「DOM」を使った時で、どのように変わるのか考えながら読んでみてください。■index.html側HTMLには div 要素に id 名を付けているだけで、中身は空です。<div id="result"></div>■pref.j... [続きを読む]
-
|
- 2008/02/23 16:37Ajax DOMを使って選択リストボックスを書き換える方法。
- 前回の最後に少し説明した通り、 Ajax で「.innerHTML」を使って、動的に生成したフォーム部品に、イベントハンドラを設定すると、不具合が出ることがあります。そこで今回は DOM(ドム:Document Object Model) を使った方法に書き換えてみます。DOM は慣れるまで少し難しく感じると思いますが、今回はとりあえず動かしてみることに専念してください。【1】sample009 フォルダをコピーして sample010 フォルダを作成します。【2】今 [続きを読む]
-
|
|
- 2008/02/22 23:16Ajax sample009で使用したプログラムの解説。
- 今回は sample009 で使用した Ajax のプログラムについて、詳しく解説します。これまでとほとんど同じプログラムなので、選択リストボックスを動的に作成するところ以外は簡単だと思います。Ajax で非同期通信することで、XML形式のデータを、フォーム部品の値として表示する方法をつかんでください。選択リストボックスは、「オプションメニュー」や「セレクトボックス」という場合もあります。■index.html側sample005と比べると [続きを読む]
-
|
- 2008/02/22 16:50Ajax 選択リストボックスを動的に作成する方法
- 今回は Ajax を使って、非同期通信で取得した XML データを、「選択リストボックス」にしてみましょう。選択リストボックスは Web サイトでよく使われています。選択リストボックスを使うと、一覧から入力できるようになります。しかもデータベースに連動して動的に変化させる方法を覚えておくと、用途がとても広がります。【1】sample005 フォルダをコピーして sample009 フォルダを作成します。【2】今回は最終的に以下のような [続きを読む]
-
|
- 2008/01/22 15:16Ajax 動的なXMLの具体例について
- 今回は Ajax でよく使われる、動的なXMLを使った実用的でわかりやすい例を説明します。全国の市町村は 1900 以上あるのですが、データを一度に全て表示しようとすると、多すぎて大変です。そこで各都道府県ごとの市町村だけを表示できたら便利です。その場合、静的なXMLだと都道府県別に 47 のファイルを用意しなければなりません。しかし動的なXMLなら、プログラミング言語を使い、データベースから条件に合った市町村のみを取得 [続きを読む]
-
|
- 2008/01/22 14:21Ajax 静的なXMLと動的なXMLの違いについて
- Ajax のプログラムで非同期通信を行なう時、よく XMLベースのフォーマットが使われますが、それには情報が「静的」なものと「動的」なものがあります。静的 = 変化しない動的 = 変化するまずは以下のリンクをクリックして、比較してみてください。・静的なXMLhttp://ws.bzen.net/pgtop/pref.xml・動的なXMLhttp://ws.bzen.net/pgtop/GetPref.php違いがわかりましたか？表示されているデータの内容はまったく同じですが、... [続きを読む]
-
|
- 2008/01/18 16:41Ajax プログラムを自作することのメリットについて。
- 今回は Ajax のプログラムを自作することのメリットについて考えてみたいと思います。その前に少し補足すると、前回までに作成した簡易RSSリーダーは、RSS1.0対応です。RSS1.0ならそのまま動きますが、 RSS2.0、RDF、Atom、XML の場合は取得するデータの形式に合わせて変更が必要です。既成のRSSリーダーなら、ほとんどのXMLフォーマットに対応しているし、さらに高機能です。なので今さらRSSリーダーを自作するまでもありません。 [続きを読む]
-
|
- 2008/01/17 21:29Ajax sample008で使用したプログラムの解説。
- 今回は sample008 で使用した Ajax のプログラムについ
て詳しく解説します。追加や変更は少しだけで済み
ます。最小限の変更で複数のRSSフィードが読み込め
るようになっています。■index.html側(1)flash.js を読み
込む部分を追加しました。<script type="text/javascri
pt" src="flash.js"></script>(2)ニュース速
報を表示するための div要素を追加しました。<div i
d... [続きを読む]
-
|
- 2008/01/17 18:03Ajax 複数のRSSフィードを取得する方法。
- Ajax を使って作った『簡易RSSリーダー』に、複数のRSSフィードを読み込む機能を加えてみましょう。もちろん既成のRSSリーダーには及びませんが、自分で作ったシステムは細かい調整や改良ができるので、アイデア次第では可能性が広がります。今回取り込むRSSフィードは、毎日新聞のサイトで公開しているニュース速報です。ニュース速報(総合)のRSShttp://mainichi.jp/rss/etc/flash.rss＊商業目的での利用は禁止されていますのでご [続きを読む]
-
|
- 2008/01/17 11:58Ajax IEのキャッシュを無効にする方法。
- Internet Explorer で Ajax のプログラムを使って、XML形式のファイルを読み込んだ場合、2回目からはキャッシュしたデータが表示されてしまう問題がありました。Webブラウザでキャッシュしないようにするには、いくつか方法があります。・メタタグを使う(no-cache、expires)ブラウザにより動作が異なることがあるようなので、確実とはいえません。・POSTメソッドにする初心者のうちはGETメソッドのほうが便利なことがあります。Web [続きを読む]
-
|
- 2008/01/16 17:56Ajax sample006で使用したプログラムの解説。
- 今回は sample006 で使用した Ajax のプログラムについて詳しく解説します。これまでに学んだプログラムとほとんど同じなので、変更した部分を中心に解説します。またXML名前空間を扱う部分と、クロスブラウザ対応にするところは新しいので、そこに重点を置いて学んでください。基本的な解説は既に sample003 で行なっています。そちらも参考にしてください。Step14・sample003の解説http://ajax.pgtop.net/category/4479851-... [続きを読む]
-
|
- 2008/01/16 14:17Ajax XML名前空間について。
- 前回、簡易RSSリーダーを作成しましたが、読み込んだRSSフィードのタグには「名前空間」が使われています。 Ajax のプログラミングとも関連が深いので、先に名前空間について説明します。名前空間とは、XMLドキュメントの中で、要素名や属性名が衝突することを避けるために用いる修飾子のことです。XML名前空間(Namespaces in XML) または XMLネームスペース以下のようなタグ名になっているものが、名前空間を使っています。rdfやd [続きを読む]
-
|
