みんな!
いくつかの xml データ ファイルに基づいて Web サイトを構築しているので、XSLT を使用してブラウザーでスタイルシートをバインドすることにしました。
最初は非常にうまく機能しますが、最近、テンプレートがより複雑になるにつれて、奇妙なことが起こりました.
「copy-of」要素を使用して、データをスタイルシートにコピーします。コードは次のとおりです。
<div class="section1">
<xsl:copy-of select="article/bodydata/*" />
</div>
したがって、基本的には、「bodydata」ノードのすべての子要素を <div /> にコピーしています。
しかし、うまくいきません。たとえば、bodydata に <img /> 要素があり、ブラウザーで xml ファイルにアクセスしてもその画像が表示されません。一方、「bodydata」要素をその div に手動でコピーし、.xsl ファイルを .html ファイルにすると、その画像が表示されます。
では、私の質問は、xml データと xsl データを組み合わせた出力をブラウザーで表示できますか? 拡張機能が必要ですか?
また、何が間違っている可能性があるかについての提案はありますか? 私は xslt にまったく慣れていないので、XSLT が実際に何をするのかを誤解しているようです。ありがとう!
アップデート
問題を説明するために、小さなサンプルを書きました。
まず、サンプルの xml データ ファイルを作成しました。
<?xml version='1.0' encoding='utf-8'?>
<?xml-stylesheet type="text/xsl" href="article.xsl"?>
<article>
<bodydata>
<center>
<img alt="sample" src="http://www.google.com/logos/classicplus.png" />
</center>
<p>
<data class="tts_data">
this is the paragraph.
</data>
</p>
<p>
<data class="tts_data">this is the second paragraph</data>
<data class="tts_data">more data</data>
<data class="tts_data">...</data>
</p>
</bodydata>
</article>
したがって、「bodydata」要素のすべてのノードは、Web ページに表示する必要がある html 要素であることがわかります。それを表示するために、サンプルの 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 xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="robots" content="noindex" />
</head>
<body>
<article>
<header>
header of the article
</header>
<section>
<xsl:copy-of select="article/bodydata/*" />
</section>
</article>
<footer>
footer part of the page
</footer>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
結果は次
のようになります: img 要素が消えます。
次に bodydata 要素をセクション部分にコピーし、新しい html ファイルを作成しました。
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="robots" content="noindex" />
</head>
<body>
<article>
<header>
header of the article
</header>
<section>
<center>
<img alt="sample" src="http://www.google.com/logos/classicplus.png" />
</center>
<p>
<data class="tts_data">
this is the paragraph.
</data>
</p>
<p>
<data class="tts_data">
this is the second paragraph,
</data>
<data class="tts_data">
more data
</data>
<data class="tts_data">...</data>
</p>
</section>
</article>
<footer>
footer part of the page
</footer>
</body>
</html>
結果は次
のとおりです。画像が表示されます。
だから私はここで何が間違っているのだろうかと思っています。