これを行う1つの方法は、AVT(属性値テンプレート)を使用することです。
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output omit-xml-declaration="yes" indent="yes"/>
<xsl:strip-space elements="*"/>
<xsl:template match="/">
<div style="text-decoration: underline; color: blue;"
onclick="var e = document.getElementById('{div_id}');
if(e.style.display == 'block')
e.style.display = 'none';
else
{{
e.style.display = 'block';
e.scrollIntoView();
}}">Toggle</div>
</xsl:template>
</xsl:stylesheet>
この変換が次のXMLドキュメントに適用される場合:
<div_id>3</div_id>
必要な結果が生成されます:
<div style="text-decoration: underline; color: blue;" onclick="var e = document.getElementById('3'); if(e.style.display == 'block') e.style.display = 'none'; else { e.style.display = 'block'; e.scrollIntoView(); }">Toggle</div>
注:このようなAVT(attribute-value-template)を指定する場合は、生成する必要のある任意の文字{
または}
文字を2倍にする必要があります。
別の方法は使用することxsl:attribute
です:
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output omit-xml-declaration="yes" indent="yes"/>
<xsl:strip-space elements="*"/>
<xsl:template match="/">
<div style="text-decoration: underline; color: blue;">
<xsl:attribute name="onclick">
var e = document.getElementById('<xsl:value-of select="div_id"/>');
if(e.style.display == 'block')
e.style.display = 'none';
else
{
e.style.display = 'block';
e.scrollIntoView();
}</xsl:attribute>Toggle</div>
</xsl:template>
</xsl:stylesheet>