• ベストアンサー
※ ChatGPTを利用し、要約された質問です(原文:XML を JavaScript で表示したい)

JavaScriptでXML属性を表示する方法

このQ&Aのポイント
  • 初心者ですが、JavaScriptを使用してXMLの属性を表示しようとしています。しかし、属性の表示方法に問題があり、属性部分が「null」と表示されるだけで正しく反映されません。
  • 質問者はXMLファイルの内容をJavaScriptで表示するために、orders.xmlとorders.dtdのファイルを使用していますが、いくつかのエラーに遭遇しました。
  • また、ダウンロードしたorders.xmlファイルを正しく表示するために、JavaScriptのコードを修正する必要があります。

質問者が選んだベストアンサー

  • ベストアンサー
  • yyr446
  • ベストアンサー率65% (870/1330)
回答No.1

XMLに投稿されていた質問の続きですね。 アトリビュートはテキストノードの親の子要素で、複数ある可能性があるから配列オブジェクトです。その辺を考慮する必要があります。 こうです。 <?xml version = "1.0" encoding="UTF-8" standalone="yes" ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns = "http://www.w3.org/1999/xhtml" lang="ja-JP"> <head> <title>A Parser Test</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta http-equiv="Cache-Control" content="no-cache" /> <meta http-equiv="Expires" content="0" /> <script type="text/javascript"> //<![CDATA[ var tab="&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;" function printElement(indent, node) { var i; if (node.nodeType == 3) { document.write("<br />" +indent + node.nodeValue); } else { document.write("<br />" +indent + "[" + node.parentNode.nodeName + "]"); for(j = 0; j < node.attributes.length ; j++){ document.write("<br />" +indent + node.attributes[j].nodeName +":"+ node.attributes[j].nodeValue); } for (i = 0; i < node.childNodes.length; i++) { printElement(indent+tab, node.childNodes[i]); } document.write("<br />" +indent + "[/" + node.nodeName + "]"); } } var xmlDoc = new ActiveXObject("Microsoft.XMLDOM") xmlDoc.async="false" xmlDoc.load("orders.xml") if (xmlDoc.parseError.errorCode != 0) { document.write("<br />Error Code: "); document.write(xmlDoc.parseError.errorCode); document.write("<br />Error Reason: "); document.write(xmlDoc.parseError.reason); document.write("<br />Error Line: "); document.write(xmlDoc.parseError.line); document.write("<br />"); } else { document.write("<strong>ファイルはパーサーを通りました</strong><br />"); document.write("<p /><h1>ツリー構造の表示</h1><p />") printElement("", xmlDoc.documentElement); } //]]> </script> </head> <body> </body> </html> 関係ないけどDTD定義がでたらめです。 余計な事ですが、IE以外を考慮するともっと複雑になります。

laser-disc
質問者

補足

yyr446 様 おーっ、動きます!回答2の内容も反映させてみましたが、ちゃんと動いています!!スバラシイ! >アトリビュートはテキストノードの親の子要素で、複数ある可能性があるから配列オブジェクトです。 なるほど、コードを見た感じだと、既存の「ノード→子ノード」に適用していた『ループでデータを取り出す』範囲を、「単ノード→内包要素」に移行して適用した感じですね。 理屈は分かるんですがイザやってみろと言われると難しいです。XML 寄りの話ばっかりで js の事は殆ど触れないでいて、いきなりこれが来たので苦戦していました。 追伸: 済みません、dtd の所に xml の内容を重複してコピペしてました; 失礼。(焦りが出てましたね…。) ---DTD--[orders.dtd]----------------- <!ELEMENT orders (order*)> <!ELEMENT order (customerid, status, item*)> <!ELEMENT customerid (#PCDATA) > <!ATTLIST customerid limit CDATA #REQUIRED> <!ELEMENT rating:creditRating (#PCDATA)> <!ELEMENT status (#PCDATA)> <!ELEMENT item (name, price, qty)> <!ATTLIST item instock CDATA #REQUIRED itemid CDATA #REQUIRED> <!ELEMENT name (#PCDATA)> <!ELEMENT price (#PCDATA)> <!ELEMENT qty (#PCDATA)>

すると、全ての回答が全文表示されます。

その他の回答 (1)

  • yyr446
  • ベストアンサー率65% (870/1330)
回答No.2

yyr446です。 もう一ヶ所修正した方がよい。 else { document.write("<br />" +indent + "[" + node.parentNode.nodeName + "]"); ここは else { document.write("<br />" +indent + "[" + node.nodeName + "]"); としないと、正しく入れ子が表現されていないですね。

laser-disc
質問者

お礼

他の言語に比べて情報が入手しにくい感じがあったので、御指南いただき大変ありがたく思います。m(O)m 低頭

laser-disc
質問者

補足

わあ、丁寧に有り難うございます! 試した結果は追ってご報告します(とか言って「上手くいきません~(TT)」というオチも……)。 まずは頑張ってみます!

すると、全ての回答が全文表示されます。

専門家に質問してみよう