时间戳

首页 > 解决方案 > 使用 XSLT 编写 DHTML

javascript - 使用 XSLT 编写 DHTML

问题描述

HTML 是由 XSLT 编写的。

我知道如何在 XSLT 本身中使用脚本，但不知道 XSLT 如何将脚本块写入 DHTML。我知道如何手动编写 HTML，但我当然希望 XSLT 完成繁重的工作。

下面的代码是我期望的工作，但没有。它只是在页面头部显示代码。

<head>
    <title>My HTML</title>
    <msxsl:script type="text/javascript" version="1.3">
        <![CDATA[
            var coll = document.getElementsByClassName("collapsible");
            var i;

            for (i = 0; i < coll.length; i++) {
                coll[i].addEventListener("click", function() {
                this.classList.toggle("active");
                var content = this.nextElementSibling;
                if (content.style.display === "block") {
                    content.style.display = "none";
                    } else {
                    content.style.display = "block";
                    }
                });
            }
        ]]>
    </msxsl:script>
</head>

脚本显示为文本

这是为 NHS 工作的，请非常漂亮……谢谢。

标签： javascriptxsltdhtml

解决方案

如果您的 XSLT 创建的 HTML 应该包含一个 HTMLscript元素，那么您将按照与使用headortitle元素相同的方式插入它。在 XSLT 中，XSLT 是 XML，您需要确保您的内联 Javascript 代码不会破坏 XML 规则，就像您对 CDATA 部分所做的那样，但该script元素将是普通script元素而不是msxsl:script元素。

除了和 using xsl:output method="html"，没有什么特别的。

head在解析任何元素之前，您在使用var coll = document.getElementsByClassName("collapsible");和尝试处理该集合的部分中的特定代码应该实现什么是值得怀疑的，但这是一个适当使用 Javascript 的问题，也许是事件处理程序或函数调用而不是内联代码。

根据 XSLT 的执行位置（客户端或服务器），XSLT 和 Javascript 的整个交互可能很脆弱，动态添加脚本，即使没有 XSLT，也可能是跨浏览器的挑战。

推荐阅读