xml+xslでの変換内容をtextareaへ
- xmlとxslを使用してHTMLに変換する際、変換内容をtextareaにも表示させたい。
- FireFoxでDOMツリーを参照しているが、ノードをtextareaに表示できない。
- 要素のhrefとsrc属性を含む画像を表示するxsltテンプレートを使用している。
- ベストアンサー
xml+xslでの変換内容をtextareaへ
お世話になります。 xml+xslでhtmlに変換する際、その変換内容をtextareaにも表示させるようにしたいのです。 使用ブラウザ：FireFox。現状はFirebugでDOMツリーを手動で参照してる状況です。 現在は、ノードをtextareaに表示しようとすると[object DocumentFragment]とだけ出てしまい、DocumentFragmentという概念あることは分かり、色々調べcreateElement()やcreateTextNode()など、その他思いつく限りの事でテストしてみてるのですが、どうにもノードをHTMLタグとしてtextareaに表示させる事が出来ません。 以下にポイントとなるソースを掲示しますので、どなた様か、お助け願えませんでしょうか --test.html---- <html><head> <meta content="text/html; charset=utf8" http-equiv="content-type"> <title>JS+xslt</title> <script type="text/javascript"> function tramsformlists(xmlFile, xslFile, resultNodeID){ var xml, xslt, newDoc; if(document.all){ xml = new ActiveXObject("Microsoft.XMLDOM"); xslt = new ActiveXObject("Microsoft.XMLDOM"); }else { xml = document.implementation.createDocument("", "", null); xslt = document.implementation.createDocument("", "", null); } xml.async = false; xslt.async = false; xml.load(xmlFile); xslt.load(xslFile); if(document.all){ document.getElementById(resultNodeID).innerHTML = xml.transformNode(xslt); }else { var xsltp = new XSLTProcessor(); xsltp.importStylesheet(xslt); newDoc = xsltp.transformToFragment(xml, window.document); var df = document.createDocumentFragment(); cloneDoc= newDoc.cloneNode(true); document.getElementById("Div"+resultNodeID).innerHTML = ""; document.getElementById("Div"+resultNodeID).appendChild(newDoc); t = document.msg_form.TextareaTest.value; document.msg_form.TextareaTest.value =t + df.appendChild(cloneDoc); } } </script> </head><body> <form name="msg_form"> <ul> <li> <input type="button" value="Menu" onclick="tramsformlists('test0.xml','test0.xsl','Test')"><br> <div id="DivTest"></div> <textarea cols="50" rows="10" id="TextareaTest">あああああああ</textarea> </li> </ul> </form> </body></html> --test0.xml-- <?xml version="1.0" encoding="utf-8"?> <root> <nolink_logo> </nolink_logo> </root> --test0.xsl-- <?xml version="1.0" encoding="utf-8"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:output method="html" encoding="utf-8"/> <xsl:template match="root"> <xsl:apply-templates select="nolink_logo"/> </xsl:template> <xsl:template match="nolink_logo"> <xsl:call-template name="Test" /> </xsl:template> <xsl:template name="Test"> <xsl:variable name="menu" select="document('test1.xml')/root"/> <div>画像を表示 <xsl:for-each select="$menu"> <xsl:element name="a"> <xsl:attribute name="href"> <xsl:value-of select="url[1]"/> </xsl:attribute> <xsl:attribute name="target">_blank</xsl:attribute> <xsl:element name="img"> <xsl:attribute name="src"> <xsl:value-of select="img[1]"/> </xsl:attribute> </xsl:element> </xsl:element> </xsl:for-each> </div> </xsl:template> </xsl:stylesheet> --test1.xml-- <?xml version="1.0" encoding="utf-8"?> <root> <img>http://domain/image2.gif</img> <url>http://domain/test.html</url> </root>
- taku0
- お礼率80% (160/199)
- JavaScript
- 回答数1
- ありがとう数1
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
使用ブラウザが Firefox（および Opera、Safari）であるなら、以下だけで十分です。 var doc = document; var impl = doc.implementation; var xml = impl.createDocument("", "", null); xml.async = false; xml.load(xmlFile); var xslt = impl.createDocument("", "", null); xslt.async = false; xslt.load(xslFile); var xsltp = new XSLTProcessor(); xsltp.importStylesheet(xslt); var df = xsltp.transformToFragment(xml, doc); var t1 = doc.forms["msg_form"].elements["TextareaTest"]; t1.value += (new XMLSerializer).serializeToString(df); var t2 = doc.getElementById("Div"+resultNodeID); t2.innerHTML = ""; t2.appendChild(doc.importNode(df, true)); ポイントは XMLSerializer、ついでに importNode です。 --- IE を含めるなら、Windows 2000 を使っているのでなければ、もう "Microsoft" のを使わないで下さい（廃止されています）。また、document.all での分岐は禁物です（これはもともと非常にマズいやり方で、しかもあまりに広まってしまったので、他のブラウザも分岐を通すようになったからです）。 try { var xml = new ActiveXObject("Msxml2.DOMDocument.3.0"); xml.async = false; xml.load(xmlFile); var xslt = new ActiveXObject("Msxml2.FreeThreadedDOMDocument.3.0"); xslt.async = false; xslt.load(xslFile); ... } catch (err) { ... } なお、ここでは MSXML 3.0 を使いましたが、importNode を使いたければ 6.0 を使う必要があります。バージョンを省略すると必ず 3.0 が呼び出されますので、使い分けて下さい。
関連するQ&A
- javascriptからxsltに値を渡したい
お世話になります。 下記のサイトを参考に http://webcache.googleusercontent.com/search?q=cache:587mPIaRXcwJ:www.tagindex.com/kakolog/q4bbs/1701/2037.html+xsltProc.setParameter&cd=5&hl=ja&ct=clnk&gl=jp&lr=lang_ja http://webcache.googleusercontent.com/search?q=cache:qLCKa_Rxc58J:domes.lingua.heliohost.org/dom/intro-misc2.html+xsltProc.setParameter&cd=2&hl=ja&ct=clnk&gl=jp&lr=lang_ja http://webcache.googleusercontent.com/search?q=cache:SJR9ZdyaGNUJ:taugus.web.fc2.com/WEB/XML/xml.html+javascript%E3%81%8B%E3%82%89xslt%E3%81%AB%E5%80%A4%E3%82%92%E6%B8%A1%E3%81%97%E3%81%9F%E3%81%84&cd=4&hl=ja&ct=clnk&gl=jp javascriptからxsltに値を渡したいと考え、下記のように設定してみているのですが、思うようにxsltファイルで参照出来ず、途方に暮れております。 どなた様か解決法などご教授願えませんでしょうか。お願い致します。 ※環境は、FireFox3.5を使っておりまして、現状、FireFoxのみで動作すれば良いと考えてます。 --test-1.html---- <html><head> <meta content="text/html; charset=utf8" http-equiv="content-type"> <title>JS+xslt</title> <script type="text/javascript"> function tramsformlists(xmlFile, xslFile, resultNodeID, Num){//chTag=inputのthis.value // alert("resultNodeIDは" + resultNodeID + "です。"); var xml, xslt, newDoc; var doc = document; var impl = doc.implementation; // XML ドキュメントの読み込み var xml = impl.createDocument("", "", null); xml.async = false; xml.load(xmlFile); // XSL ドキュメントの読み込み var xslt = impl.createDocument("", "", null); xslt.async = false; xslt.load(xslFile); // XSLT プロセッサを作成 var xsltp = new XSLTProcessor(); xsltp.importStylesheet(xslt); // 下記２つのどちらかの方法で取得したいと思ってますが、xslt側で、どちらの方法でも参照できないです xsltp.setParameter ('', "param.num", param.value); xsltp.setParameter ('', "Num", Num); // XSLT 実行（戻り値は文書断片ノード） var df = xsltp.transformToFragment(xml, doc); // 結果を付加 // var t3 = doc.getElementById("LorRorC"); // t4=t3.options[t3.selectedIndex].value; // alert("resultNodeIDは" + t4 + "です。"); var t1 = doc.getElementById("Div"+resultNodeID); t1.innerHTML = ""; t1.appendChild(doc.importNode(df, true)); var t2 = doc.forms["msg_form"].elements["Textarea" + resultNodeID]; t2.value = (new XMLSerializer).serializeToString(df);//DOM ノードを XML データに書き出す } </script> </head><body> <form name="msg_form"> <ul> <li> <input type="button" value="Menu" onclick="tramsformlists('test0.xml','test0.xsl','Test','10')"><br> <select name="num"> <option value="10" selected="selected">10</option> </select> <div id="DivTest"></div> <textarea cols="50" rows="10" id="TextareaTest">あああああああ</textarea> </li> </ul> </form> </body></html> ---- --test0.xml--- <?xml version="1.0" encoding="utf-8"?> <root> <nolink_logo> </nolink_logo> </root> ---- --test0.xsl--- <?xml version="1.0" encoding="utf-8"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:output method="html" encoding="utf-8"/> <xsl:template match="root"> <xsl:apply-templates select="nolink_logo"/> </xsl:template> <xsl:template match="nolink_logo"> <xsl:call-template name="Test" /> </xsl:template> <xsl:template name="Test"> <xsl:variable name="menu" select="document('test1.xml')/root"/> <xsl:param name="param.num">0</xsl:param> <xsl:param name="Num">0</xsl:param> <div id="{$param.num} {$Num}">画像を表示 <xsl:for-each select="$menu"> <xsl:element name="a"> <xsl:attribute name="href"> <xsl:value-of select="url[1]"/> </xsl:attribute> <xsl:attribute name="target">_blank</xsl:attribute> <xsl:element name="img"> <xsl:attribute name="src"> <xsl:value-of select="img[1]"/> </xsl:attribute> </xsl:element> </xsl:element> </xsl:for-each> </div> </xsl:template> </xsl:stylesheet> ---- --test1.xml-- <?xml version="1.0" encoding="utf-8"?> <root> <img>http://domain/image2.gif</img> <url>http://domain/test.html</url> </root> ---- 大変恐縮ですが、どなた様かご教授頂けませんでしょうか 宜しく願い致します。
- ベストアンサー
- JavaScript
- XMLの実体参照とXSLT
次のようなXMLファイルをXSLTで処理したいのですが、&baseの部分がうまく表示できません。 どのようにしたら表示できるでしょうか？ ■a.xml <?xml version="1.0" encoding="UTF-8"?> <?xml-stylesheet type="text/xsl" href="a.xsl"?> <!DOCTYPE test [ <!ELEMENT name (#PCDATA)> <!ENTITY base SYSTEM "base.xml"> ]> <test> <name>abc</name> &base; </test> ■base.xml <?xml version="1.0" encoding="UTF-8"?> <base>base</base> ■a.xsl <?xml version="1.0" encoding="UTF-8"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:output method="xml" encoding="UTF-8" /> <xsl:template match="/"> <xsl:apply-templates select="test" /> <xsl:apply-templates select="base" /> </xsl:template> <xsl:template match="test"> name:<xsl:value-of select="name" /> </xsl:template> <xsl:template match="base"> base:<xsl:value-of select="base" /> </xsl:template> </xsl:stylesheet> □結果 name:abc ※base.xmlの内容を表示できない
- ベストアンサー
- XML
- XSLのifがいまいち理解ができなく。
if文をどうやればいいのかで悩んでしまいに詰まっている状態です。 URLがない場合は何も表示しないにしたいのですが、参考ページを見ても全くわからない状態。 test.xsl <?xml version="1.0" encoding="utf-8"?> <xsl:stylesheet> <xsl:template match="/"> <xsl:apply-templates select="page/message"/> </xsl:template> <xsl:template match="page/message"> <table> <tr> <td>名前</td> <td><xsl:value-of select="name"/></td> </tr> <tr> <td>URL</td> <td><a><xsl:attribute name="href"><xsl:value-of select="@url" /></xsl:attribute><xsl:attribute name="target">_blank</xsl:attribute><xsl:value-of select="@url" /></a></td> </tr> </table> </xsl:template> </xsl:stylesheet> xml <?xml version="1.0" encoding="utf-8"?> <page> <message url="http://yahoo.co.jp"><name>山田太郎</name></message> <message url=""><name>山田花子</name></message> </page>
- ベストアンサー
- XML
- XSL変換したが画像が表示できません
下記のXMLの画像データを表示するためXSL変換したが画像が表示できません ちなみに同drに設置しています。 PHOT.XML <?xml version="1.0"?> <?xml-stylesheet type="text/xsl" href="style.xsl"?> <photos> <photo url="http://www.kahokanko.com/demo/10.jpg"/> <photo url="http://www.kahokanko.com/demo/19.jpg"/> <photo url="http://www.kahokanko.com/demo/31.jpg"/> </photos> STYLE.XSL <?xml version="1.0" encoding="UTF-8"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="/"> <html> <head> <title>サンプル</title> <link rel="styleSheet" type="text/css" href="./xx.css" /> </head> <body> <h1>画像を表示</h1> <div> <xsl:apply-templates /> </div> </body> </html> </xsl:template> <xsl:template match="photo"> <p class="album"> <img> <xsl:attribute name="src"> <xsl:value-of select="@url" /> </xsl:attribute> </img> </p> </xsl:template> </xsl:stylesheet>
- 締切済み
- HTML
- XSLの中でHTMLタグが使えない
XMLとXSLTを使って、Formの中のListのオプションを、XML から取ってきたいと思ってます。イメージ的には、下記 の○○○の中に、<xsl:value-of select="."/>を入れる ことによって、<option value="<xsl:value-of select="."/>"><xsl:value-of select="."/></option> の様にしたいのですが、<や>を<や>に変えても、 うまく表示されません。また、Selectタグの属性の Multipleも＝サインが無いとかで使えませし,Inputタグ も、終了タグが無いため使えませんでした。どのように 対処したら良いのでしょうか？よろしくお願いしま す。 <select name="list1" size="10" id="select5"> <xsl:apply-templates/> </select> <xsl:template match="//name"> <option value="○○○">○○○</option> </xsl:template>
- 締切済み
- XML
- xsl:variableについて
お世話になります。xsl:variableについて質問です。 xsl:elementのnameを動的に指定したく、次のようにしました。 FireFox3 Beta 5にて、innerHTMLをtextareaに貼り付けて確認しました。 xml <testNode>aaa</testNode> xsl <xsl:variable name="el"><xsl:value-of select="name(.)"/></xsl:variable> <xsl:element name="$el">aiueo</xsl:element> こうすると、 aiueo のみ出力されました。希望する出力は <testNode>aiueo<testNode> です。 xsl:variableの使い方が間違っているのでしょうか？先程からずっとこれに悩んでいます。。。 よろしくお願いします。
- ベストアンサー
- XML
- XSLで、XMLの空タグを制御したい。
値がないXML文書に、 <exsample /> こう書かれてしまうものを、 <exsample></exsample> このように出力したいのですが、出来ずでした。 以下は、私のやり方です。 ■ XSL <?xml version="1.0" encoding="Shift_JIS"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:xalan="http://xml.apache.org/xslt"> <xsl:output method="xml" encoding="Shift_JIS" indent="yes" xalan:indent-amount="4"/> <xsl:template match="/"> <xsl:copy-of select="."/> </xsl:template> </xsl:stylesheet> ■ XML <?xml version="1.0" encoding="Shift_JIS"?> <root> <section> <category> <exsample1>value</exsample1> <exsample /> </category> </section> </root> ご教授、よろしくお願いいたします。
- ベストアンサー
- XML
- XMLをXSLを使いHTMLに変換したいのですが・・・・
あるＸＭＬ形式のＸＳＬ用に次のようにスタイルシートを作成致しました。（例） <?xml version="1.0" encoding="UTF-8"?> <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0"> <xsl:output method="html" version="4.01" encoding="UTF-8" indent="yes" /> <xsl:template match="/"> <html lang="ja"> <head> <title>○○情報</title> </head> <body><xsl:apply-templates select="ProductInfo"/></body> </html> </xsl:template> <xsl:template match="Responce/Details"/> <h2><xsl:value-of select="Hid"/></h2> <h2><xsl:value-of select="TotalItems"/></h2> <h2><xsl:value-of select="TotalPages"/></h2> <h3><xsl:value-of select="ItemID"/></h3> <h3><xsl:value-of select="ShopID"/></h3> <h3><xsl:value-of select="ProductName"/></h3> <h3><xsl:value-of select="Price"/></h3> <h3><xsl:value-of select="ImageUrlSmall"/></h3> <h3><xsl:value-of select="ImageUrlMedium"/></h3> <h3><xsl:value-of select="mageUrlLarge"/></h3> <h3><xsl:value-of select="URL"/></h3> <h3><xsl:value-of select="MobileURL"/></h3> <h3><xsl:value-of select="Manufacture"/></h3> <h3><xsl:value-of select="Availability"/></h3> <h3><xsl:value-of select="Stock"/></h3> <h3><xsl:value-of select="StockInfinity"/></h3> <h3><xsl:value-of select="ItemDetail"/></h3> <h3><xsl:value-of select="SalesStatus"/></h3> <h3><xsl:value-of select="CategoryID"/></h3> </xsl:template> </xsl:stylesheet> とスタイルシートを作成いたしました。 変換するＨＭＬは <?xml version="1.0" encoding="UTF-8" ?> <?xml-stylesheet type="text/xsl" href="○○.xsl"?> - <ProductInfo> - <Responce> <Hid>○○○○</Hid> <TotalItems>○○○○</TotalItems> <TotalPages>○○○○</TotalPages> - <Details> <ItemID>○○○○</ItemID> <ShopID>○○○○</ShopID> <ProductName>○○○○</ProductName> <Price>○○○○</Price> <Manufacture>○○○○</Manufacture> <Availability>○○○○</Availability> <Stock>0○○○○</Stock> <StockInfinity>○○○○</StockInfinity> <ItemDetail>○○○○</ItemDetail> <SalesStatus>○○○○</SalesStatus> <CategoryID>○○○○</CategoryID> </Details> </Responce> </ProductInfo> 以下<Details>のみ複数繰り返しされます。 この通りに作成したのですが、ＸＭＬファイルをウインドウに表示しようとしてもエラーが報告されます。 ＸＳＬに繰り返し用のタグを入れても、まったく表示されません。 ちなみにＩＥ７を使用しています。 もし間違っている箇所が分かる方がいらっしゃいましたら、教えていただけませんか？ よろしくお願いいたします。
- ベストアンサー
- XML
- XSLTでの外部XMLファイルの読み込みについて。
XSLTについて質問がございます。 下記のように、document関数を用いて外部のxmlを取り込んでいるのですが、 もし、そのxmlファイルが存在しなかった場合はエラーとなってしまいます。 この時、対象のxmlファイルが存在するか否かを、XSLTで調べる事は可能なのでしょうか？ boolean関数を用いてみたりしたのですが、ファイルがない場合はやっぱりエラーになってしまいます。 どなたかご教授願います。 <!-- STYLESHEET --> <?xml version="1.0" encoding="UTF-8"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:import href="xsl1.xsl"/> <xsl:param name="doc" select="document('../XML/import.xml')"/> </xsl:stylesheet>
- ベストアンサー
- XML
- XML/XSLでテンプレートの適用がうまくいかない
同じツリーの深さで異なる要素名のノードがあるXMLだと期待通りにテンプレートが適用できない という問題に付き当たっています。 例えば / +------+ poem poem のような構成だとmatch=poem、value-of select="text"などで各poemの歌詞を表示させることが できます。 一方、以下の構成で同じ事をやろうとすると各poemの歌詞に加えてyearのnumのValueまで 列挙されてしまいます。poemの中身だけ出すにはどうすればよいでしょうか？ 以下に例を書きます。 / +--------------+ list year +------+ +----+ poem poem Num Num 例えば以下のURLなどを参照してやっております。 http://www6.airnet.ne.jp/manyo/xml/xslt/step15.html XSLはこんな感じです。 <xsl:template match="/"> <xsl:apply-templates /> </xsl:template> <xsl:template match="poem"> <tr> <td><xsl:value-of select="poet" /></td> <td><xsl:value-of select="yomi" /></td> </tr> <br /> </xsl:template> 手持ちのXMLを変換したく、その勉強のため上記のような構成のXMLを扱う方法を 知りたいと思っています。 よろしくお願いします。
- 締切済み
- XML
お礼
ご教授頂きありがとうございます！ importNodeで元のノードのクローンを作り XMLSerializerでDOMをテキストに変換すると言う事ですか。 素晴らしいです！ 分からない事が分かってきて出来ない事が出来てくるって良いですね。 ありがとうございました！