Javascript 在XSLT中加载动态内容时如何创建函数

我只为静态元素调用函数collapseandexpand（），那么它将不起作用，所以现在如何在xslt中加载动态内容时创建相同的函数

Javascript代码：

<script language="javascript" type="text/javascript">
<xsl:text>
function collapseandexpand(){
if(document.getElementById ('subList').style.display == 'none')
document.getElementById ('subList').style.display = 'block';
else
document.getElementById ('subList').style.display = 'none';         
}
</xsl:text>
</script>

函数collapseandexpand（）{
if（document.getElementById（'subList'）.style.display=='none'）
document.getElementById（'subList'）.style.display='block'；
其他的
document.getElementById（'subList'）.style.display='none'；
}

将XSLT代码更改为

 <div class="mainDiv">
    <div class="subDiv">
    <a href="#" onClick="collapseandexpand(document.getElementById('{generate-id()}'))">
        <span>
            <xsl:value-of select="$key"/>
        </span>
    </a>                
    </div>
    <div class="childsubDiv" id="{generate-id()}" >
    <ul id="subMenu" class="subMenu">
        <xsl:for-each select="pages/page">
         <xsl:sort select="@order" data-type="number"/>
             <xsl:apply-templates select=".">
             <xsl:with-param name="context" select="$context"/>
             </xsl:apply-templates>
        </xsl:for-each>
    </ul>
    </div>
</div>

---

那么，XSLT代码在同一文档中生成多个

id=“subList”

元素的问题是什么？

id

必须是唯一的，才能使用

文档。getElementById

@Martin Honnen:这里生成了一些动态div。现在我正在尝试展开和折叠每个div。但只有第一个是有效的展开和折叠其余div不起作用。我很怀疑{generate-id（）}表示它是自动生成的id？感谢您的帮助，它工作正常。非常感谢@Martin Honneni添加了css，但没有显示展开和收拢的图像。请就css问题提出一个新问题，明确说明您想要实现的目标，并展示您的尝试。

function collapseandexpand (element) {
  element.style.display = element.style.display == 'none' ? '' : 'none';
}