XSLT:在元素标记中输出Javascript

时间:2012-08-01 11:22:41

标签: javascript xslt

使用XSLT,如何输出以下内容

<div 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();
          }" 
          style="text-decoration: underline; color: blue;"
>Toggle</div>

注意:代码应位于onclick属性中,我只能访问文档正文。

2 个答案:

答案 0 :(得分:3)

一种方法是使用AVT(Attribute Value Templates

<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(属性值模板)时,必须将必须生成的任何{}字符加倍。

另一种方法是使用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>

答案 1 :(得分:1)

我想你想使用attribute value template例如

<div onclick="var e = document.getElementById('{div_id}'); ...">Toggle</div>