javascript - XSLT：在元素标签中输出 Javascript

Question

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

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

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

Answer 2

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

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