< WSH で Usage を表示する | 言語バーに表示される IME の名称 >

December 22, 2007

XSLT を使用して、ソース XML に含まれる HTML を結果 HTML にそのまま出力するには?

表題の通りです。ずっと壁に突き当たっています。

変換元の XML が以下のように HTML タグを含むようなケースです。

<!-- 要素 "element" は HTML タグを含みます。 -->
<element>
<h1>ほにゃらら・・・</h1>
</element>

以下のようなスタイルシートで変換すると、element 内のテキストのみ出力してしまいます。

<!-- elementノードの値を xsl:value-of で取得 -->
<xsl:template match="element">
<div><xsl:value-of select="."/></div>
</xsl:template>
<div>ほにゃらら・・・</div>

xsl:copy-of を使用すれば、ソースの構造を結果ノードへコピーすることができるはずです。

<!-- elementノード以下を xsl:copy-of で取得 -->
<xsl:template match="element">
<div><xsl:copy-of select="./node()"/></div>
</xsl:template>

試しに以下のような XML と XSL を作成してみました。

ソース XML 問題の XSL

IE では、意図したとおりにレンダリングされました。(IE での表示)出力結果の HTML までは確認していませんが。しかし、Mozilla Firefox (v2.0.0.11) では、なぜかブロック要素の前後で改行されず、テキストのようなレンダリング結果になりました。(Firefoxでの表示) 記述は正しそうに思えるのですが・・・。
ただし、結果 HTML の style タグで設定したスタイルは反映されています。Firefox で「すべてを選択」「選択した部分のソースを表示」すると、変換結果の HTML を見ることができますが、意図したとおりに変換されています。

<html xmlns="http://www.w3.org/1999/xhtml" lang="ja">
<head>
	<meta http-equiv="content-type" content="application/xhtml+xml; charset=Shift_JIS"/>
	<meta http-equiv="content-style-type" content="text/css"/>
	<title>先輩たちからのコメント</title>
	<style>
	h1 {
		padding: 0.2em 0.5em;
		font: bold medium sans-serif;
		color: #00f;
		border: 2px solid #00f;
		background: #ccf;
	}
	div.comment {
		margin: 1em;
		font: small sans-serif;
	}
	.comment dt {
		font: bold 100% sans-serif;
		color: #63f;
	}
	</style>
	</head>
	<body>
		<h1>やまださんからのコメント</h1>
		<div class="comment">
			僕の夢は、いつかこの大きなお耳で空を飛ぶことなんだ。
		</div>
		<h1>たなかさんからのコメント</h1>
		<div class="comment">
		僕がこの年まで生きてきて、人生に必要なのは以下の3つだと思いました。
		<dl>
			<dt>金</dt>
			<dd>やはり、余裕がないと人生を楽しむことはできません。あとの2つはこの一番目があって初めて意味が出てくるのです。</dd>

			<dt>友人</dt>
			<dd>ひとりぼっちでは人生は楽しくありません。同じ時間を共有する友人、上下や利害関係のない友人ができれば、人生は最高のものとなると思います。</dd>
			<dt>趣味</dt>
			<dd>金があっても、使い道がなければそれは意味を持ちません。友人がいても、何か一緒に楽しめるものがあった方が、より友情も深まるというものです。
			<br/>僕などは、まったく趣味を持たず、余暇は休息に終始していましたが、定年を目前に控え、友人を誘って近所の山へハイキングへ出かけてから、なぜ今まで休みの日を無為に寝て過ごしていたんだろうと大変惜しく感じました。できれば早いうちに打ち込める趣味を見つけておく方がよいと思います。</dd>
		</dl>
		</div>
	</body>
</html>

これを拡張子 .html として保存して表示すると、IE と同じように表示されます。

トラックバック

このエントリーにトラックバック:
http://frog.raindrop.jp/cgi-bin/mt/mt-tb.cgi/1971

コメント

コメントする

※ コメントスパム対策のため、コメント本文はおはよう、こんにちわ、こんばんわのいずれかより始めるようにしてください。

name:
email:

※ 必要ですが、表示しません。

url:
情報を保存する ?