XSLT:在元素标记中输出Javascript

XSLT: Output Javascript in the element tag

本文关键字：输出 Javascript 元素 XSLT      更新时间：2024-07-01

使用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属性中，我只能访问文档的正文。

一种方法是使用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（属性值模板）时，必须将必须生成的任何{或}字符加倍。

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

我认为您想要使用属性值模板，例如

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