第 5 章: XML インスタンスの解析
概要:
1: 効果例
2: 分析例 1. 新しいロゴを定義します。
2. XML ドキュメントを作成します。
3. 対応する HTML ファイルを作成します。
XML は、テクノロジー分野の MathML、無線通信アプリケーションの WML、ネットワーク画像の SVG など、さまざまな分野で広く使用されています。ここでは、Web での XML の応用に焦点を当てます。 Web 上の XML のアプリケーションでは、主にその強力なデータ操作機能が活用されます。一般に、JavaScript や ASP などのサーバー側プログラムで XML を使用すると、ネットワーク上のほぼすべてのアプリケーションのニーズを実現できます。
以下では説明の便宜を考慮し、サーバーサイドプログラムを含まない簡単な例を紹介します。目的は、XML のデータ操作機能を知覚的に理解できるようにすることです。
さて、まず [ここをクリック] して例の効果を確認しましょう。 (IE5.0以上のバージョンのブラウザで開いてください)
簡易的なCDレコードデータ取得機能です。 「前へ」「次へ」をクリックすると、1 枚の CD の関連情報が表示されます。私たちは当初、この効果を実現するために 2 つの方法を使用しました。
1. DHTML を使用して、さまざまなレイヤーのデータを非表示にし、マウス イベントによって順次表示します。
2. バックグラウンド プログラム (ASP、CGI、PHP、JSP など) を使用してサーバー側データを呼び出します。
しかし、この例では、ページの元のコードを開くと、DHTML DIV やフォーム アクションが完全に XML で実装されていないことがわかります。以下でその製造プロセスを分析してみましょう。
ステップ 1: 新しい ID を定義します。
実際の CD データに従って、最初に <CD> という名前の新しい ID を作成し、次に、CD 名 <Title>、歌手 <Artist>、発行年 < Year>、国 < Country> などの関連データ ID を確立します。発行会社 <Company> と価格 <Price>、最後にカタログ <CATALOG> という名前のロゴを作成する必要があります。別の <CATALOG> タグを作成する理由は何ですか? XML 文書では、ルート要素 (アイデンティティ) は 1 つしか存在しなければならないと規定されているため、複数の CD データがあり、これらのデータは並列関係にあります。そのため、これらの並列要素に対してルート要素を作成する必要があります。
上記の要素の定義と関係は XML 標準に完全に準拠しており、特別な DTD ファイルを定義する必要がないため、DTD 定義を省略できます。 DTD を使用して定義する場合、上記のプロセスは次のように表現できます。
<!エレメント カタログ (CD)*>
<!ELEMENT CD (タイトル、アーティスト、年、国、会社、価格)>
<!ELEMENT タイトル (#PCDATA)>
<!ELEMENT アーティスト (#PCDATA)>
<!ELEMENT 年 (#PCDATA)>
<!ELEMENT 国 (#PCDATA)>
<!ELEMENT 社 (#PCDATA)>
<!ELEMENT 価格 (#PCDATA)>
このコードは、要素 CATALOG に複数の CD サブ要素が含まれ、サブ要素 CD に 6 つのサブ要素 (タイトル、アーティスト、年、国、会社、価格) が含まれていることを示しており、それらの内容はテキスト (文字、数字、テキスト)。 (注: 特定の構文手順については、前の章の DTD の概要を参照してください)
ステップ 2: XML ドキュメントを作成します。
<?xml バージョン="1.0"?>
<カタログ>
<CD>
<TITLE>エンパイア バーレスク</TITLE>
<アーティスト>ボブ・ディラン</アーティスト>
<国>アメリカ</国>
<COMPANY>コロンビア</COMPANY>
<価格>10.90</価格>
<年>1985</年>
</CD>
<CD>
<TITLE>心を隠して</TITLE>
<アーティスト>ボニー・タイラー</アーティスト>
<国>英国</国>
<会社>CBS レコード</会社>
<価格>9.90</価格>
<年>1988</年>
</CD>
<CD>
<TITLE>グレイテスト ヒッツ</TITLE>
<アーティスト>ドリー・パートン</アーティスト>
<国>アメリカ</国>
<会社>RCA</会社>
<価格>9.90</価格>
<年>1982</年>
</CD>
<CD>
<TITLE>まだ憂鬱な気分です</TITLE>
<アーティスト>ゲイリー・モア</アーティスト>
<国>英国</国>
<COMPANY>ヴァージン・レドルズ</COMPANY>
<価格>10.20</価格>
<年>1990 年</年>
</CD>
<CD>
<TITLE>エロス</TITLE>
<アーティスト>エロス・ラマゾッティ</アーティスト>
<国>EU</国>
<会社>BMG</会社>
<価格>9.90</価格>
<年>1997 年</年>
</CD>
</カタログ>
上記のコードは、最初に <?xml version="1.0"?> 宣言ステートメントを使用して、これが XML ドキュメントであり、その形式が XML 1.0 標準仕様に準拠していることを示します。次にドキュメントのコンテンツがあり、構造ツリーは非常に明確です。
<カタログ>
<CD>
...
</CD>
<CD>
...
</CD>
</カタログ>
合計 5 セットのデータが定義されています。上記のコードを呼び出し用に cd.xml ファイルとして保存します。
ステップ 3: 対応する HTML ファイルを作成します。
1. XML データをインポートします。
現在普及しているブラウザの中で、現在 XML をサポートしているのは Microsoft の IE5.0 以降のブラウザだけであることがわかっています。 IE は、HTML の object オブジェクトを介した XML の挿入をサポートし、js の XMLDocument.load() メソッドを介してデータをインポートします。コードを見てみましょう: <object WIDTH="0" HEIGHT="0"
CLASSID="clsid:550dda30-0541-11d2-9ca9-0060b0ec3d39" ID="xmldso">
</オブジェクト>
ID 名 xmldso のオブジェクトを定義します。次に、js を使用して xml データをヘッド領域に導入します。
<script for="ウィンドウ" イベント="onload">
xmldso.XMLDocument.load("cd.xml");
</script>
2. データをバンドルします。
<SPAN> タグは、テーブル内の XML データをバインドするために使用されます。このうち、ID、DATASRC、DTATFLD はすべて <SPAN> の属性です。コードは次のとおりです。
<テーブル>
<tr><td>タイトル:</td><td><SPAN ID="title" DATASRC=#xmldso DATAFLD="TITLE"></SPAN></td></tr>
<tr><td>アーティスト:</td><td><SPAN ID="artist" DATASRC=#xmldso DATAFLD="ARTIST"></SPAN></td></tr>
<tr><td>年:</td><td><SPAN ID="年" DATASRC=#xmldso DATAFLD="YEAR"></SPAN></td></tr>
<tr><td>国:</td><td><SPAN ID="country" DATASRC=#xmldso DATAFLD="COUNTRY"></SPAN></td></tr>
<tr><td>会社:</td><td><SPAN ID="company" DATASRC=#xmldso DATAFLD="COMPANY"></SPAN></td></tr>
<tr><td>価格:</td><td><SPAN ID="price" DATASRC=#xmldso DATAFLD="PRICE"></SPAN></td></tr>
</テーブル>
3. アクション操作。
最後に、データの参照ボタンを提供します。
<INPUT TYPE=button VALUE="前の CD" ONCLICK="moveprevious()">
<INPUT TYPE=button VALUE="次の CD" ONCLICK="movenext()">
そして js を使用して、movenext() と moveprevious() という 2 つのマウス クリック関数を完成させます。次のコードをヘッド領域に追加します。
<スクリプト言語="JavaScript">
関数 movenext()
{
if (xmldso.recordset.absoluteposition < xmldso.recordset.recordcount)
{
xmldso.recordset.movenext();
}
}
関数 moveprevious()
{
if (xmldso.recordset.absoluteposition > 1)
{
xmldso.recordset.moveprevious();
}
}
</script>
それでは、まず HTML ファイルの元のコード全体を見てみましょう。
<html>
<頭>
<script for="ウィンドウ" イベント="onload">
xmldso.XMLDocument.load("cd.xml");
</script>
<スクリプト言語="JavaScript">
関数 movenext()
{
if (xmldso.recordset.absoluteposition < xmldso.recordset.recordcount)
{
xmldso.recordset.movenext();
}
}
関数 moveprevious()
{
if (xmldso.recordset.absoluteposition > 1)
{
xmldso.recordset.moveprevious();
}
}
</script>
<TITLE>CD ナビゲート</TITLE>
</head>
<本文>
<p>
<オブジェクト WIDTH="0" HEIGHT="0"
CLASSID="clsid:550dda30-0541-11d2-9ca9-0060b0ec3d39" ID="xmldso">
</オブジェクト>
<テーブル>
<tr><td>タイトル:</td><td><SPAN ID="title" DATASRC=#xmldso DATAFLD="TITLE"></SPAN></td></tr>
<tr><td>アーティスト:</td><td><SPAN ID="artist" DATASRC=#xmldso DATAFLD="ARTIST"></SPAN></td></tr>
<tr><td>年:</td><td><SPAN ID="年" DATASRC=#xmldso DATAFLD="YEAR"></SPAN></td></tr>
<tr><td>国:</td><td><SPAN ID="country" DATASRC=#xmldso DATAFLD="COUNTRY"></SPAN></td></tr>
<tr><td>会社:</td><td><SPAN ID="company" DATASRC=#xmldso DATAFLD="COMPANY"></SPAN></td></tr>
<tr><td>価格:</td><td><SPAN ID="price" DATASRC=#xmldso DATAFLD="PRICE"></SPAN></td></tr>
</テーブル>
<p>
<INPUT TYPE=button VALUE="前の CD" ONCLICK="moveprevious()">
<INPUT TYPE=button VALUE="次の CD" ONCLICK="movenext()">
</p>
</body>
</html>
上記のコードを cd.htm ファイルとして保存し、2 番目のステップで cd.xml ファイルと組み合わせます。 cd.htm ファイルを開くと、上記の例と同じ効果が表示されます。
ここまで、XML について多くのことを学びました。XML の概要、XML の概念原理、XML 用語、XML 構文、およびこの章の分析例の 5 つの章を要約しましょう。ここでチュートリアル部分は終了です。執筆の過程で、Ajie は関連する XML の概念を分かりやすく説明し、皆さんに自分の理解を伝えようと最善を尽くしましたが、私は長い間 XML を勉強していないため、理解が不十分でした。 XML テクノロジー全体が体系的かつ詳細ではないため、いくつかの省略があることは避けられません。ご容赦ください。