XSLT如何输出HTML?

来源:Android社区作者:松本一香头衔:网络博主
导读:本期聚焦于小伙伴创作的《XSLT如何输出HTML?》,敬请观看详情,探索知识的价值。以下视频、文章将为您系统阐述其核心内容与价值。如果您觉得《XSLT如何输出HTML?》有用,将其分享出去将是对创作者最好的鼓励。

XSLT作为XML的转换工具,能够通过定义转换规则,将源XML文档的内容映射到HTML的标签结构中,最终生成可直接在浏览器中渲染的HTML页面。整个过程的核心是编写XSLT样式表,明确XML元素和HTML元素的对应关系。

XSLT如何输出HTML?

XSLT输出HTML的基础原理

XSLT处理器会读取两个输入内容,一个是待转换的XML源文档,另一个是用于定义转换规则的XSLT样式表。处理器按照样式表中的指令,遍历XML文档的节点,将匹配到的内容按照指定的HTML结构输出,最终生成完整的HTML文档。

要实现HTML输出,首先需要在XSLT样式表中声明输出格式为HTML,避免生成默认的XML格式内容。可以通过<xsl:output>元素来设置输出参数,常用的设置包括指定输出方法为html,设置编码格式等。

基础示例:将简单XML转换为HTML

第一步:准备源XML文档

下面是一个存储了学生信息的XML文档,后续会通过XSLT将其转换为展示学生信息的HTML表格。

<?xml version="1.0" encoding="UTF-8"?>
<students>
    <student>
        <id>1</id>
        <name>张三</name>
        <age>20</age>
        <score>92</score>
    </student>
    <student>
        <id>2</id>
        <name>李四</name>
        <age>21</age>
        <score>88</score>
    </student>
</students>

第二步:编写XSLT样式表

样式表需要定义HTML的整体结构,同时通过<xsl:for-each>等元素遍历XML节点,将XML中的数据填充到HTML的对应位置。

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
    <!-- 设置输出格式为HTML -->
    <xsl:output method="html" encoding="UTF-8" indent="yes"/>

    <!-- 匹配根节点,生成HTML整体结构 -->
    <xsl:template match="/">
        <html>
            <head>
                <title>学生信息表</title>
                <style>
                    table { border-collapse: collapse; width: 60%; margin: 20px auto; }
                    th, td { border: 1px solid #333; padding: 8px; text-align: center; }
                    th { background-color: #f0f0f0; }
                </style>
            </head>
            <body>
                <h2 style="text-align: center;">学生信息列表</h2>
                <table>
                    <tr>
                        <th>学号</th>
                        <th>姓名</th>
                        <th>年龄</th>
                        <th>成绩</th>
                    </tr>
                    <!-- 遍历所有student节点 -->
                    <xsl:for-each select="students/student">
                        <tr>
                            <td><xsl:value-of select="id"/></td>
                            <td><xsl:value-of select="name"/></td>
                            <td><xsl:value-of select="age"/></td>
                            <td><xsl:value-of select="score"/></td>
                        </tr>
                    </xsl:for-each>
                </table>
            </body>
        </html>
    </xsl:template>
</xsl:stylesheet>

第三步:执行转换得到HTML

将上述XSLT样式表和XML文档放在同一目录,通过XSLT处理器(比如浏览器的XML解析器、或者Java的Transformer类等)执行转换后,得到的HTML内容如下:

<html>
    <head>
        <title>学生信息表</title>
        <style>
            table { border-collapse: collapse; width: 60%; margin: 20px auto; }
            th, td { border: 1px solid #333; padding: 8px; text-align: center; }
            th { background-color: #f0f0f0; }
        </style>
    </head>
    <body>
        <h2 style="text-align: center;">学生信息列表</h2>
        <table>
            <tr>
                <th>学号</th>
                <th>姓名</th>
                <th>年龄</th>
                <th>成绩</th>
            </tr>
            <tr>
                <td>1</td>
                <td>张三</td>
                <td>20</td>
                <td>92</td>
            </tr>
            <tr>
                <td>2</td>
                <td>李四</td>
                <td>21</td>
                <td>88</td>
            </tr>
        </table>
    </body>
</html>

常用XSLT元素说明

  • <xsl:template>:定义转换模板,通过match属性指定匹配哪些XML节点,匹配到的节点会按照模板内的规则处理。
  • <xsl:value-of>:用于提取XML节点的值,select属性指定要提取的节点路径,提取的内容会直接输出到结果中。
  • <xsl:for-each>:遍历节点集合,select属性指定要遍历的节点路径,循环内的内容会对每个匹配的节点执行一次。
  • <xsl:if>:条件判断元素,test属性指定判断条件,满足条件时才会输出内部的内容,比如可以筛选出成绩大于90的学生。

注意事项

在编写XSLT输出HTML时,需要注意HTML标签的闭合规则,比如<br><img>这类单标签,在XSLT中如果输出为HTML格式,处理器会自动处理正确的闭合方式,不需要手动写成XML的闭合形式。

如果XML文档中包含特殊字符,比如<、>、&,XSLT处理器会自动对输出到HTML中的内容做转义处理,不需要开发者手动转义,避免生成的HTML出现语法错误。

当需要在HTML中嵌入CSS样式时,可以直接将style标签写在XSLT的模板中,和编写普通HTML的CSS方式一致,样式会正常生效。

XSLTHTMLXMLtransform修改时间:2026-06-14 05:36:24

免责声明:​ 已尽一切努力确保本网站所含信息的准确性。网站内容多为原创整理与精心编撰,观点力求客观中立。本站旨在免费分享,内容仅供个人学习、研究或参考使用。若引用了第三方作品,版权归原作者所有。如内容涉及您的权益,请联系我们处理。
内容垂直聚焦
专注技术核心技术栏目,确保每篇文章深度聚焦于实用技能。从代码技巧到架构设计,为用户提供无干扰的纯技术知识沉淀,精准满足专业提升需求。
知识结构清晰
覆盖从开发到部署的全链路。AI、前端、编程、数据库、服务器、建站、系统层层递进,构建清晰学习路径,帮助用户系统化掌握开发与运维所需的核心技术。
深度技术解析
拒绝泛泛而谈,深入技术细节与实践难点。无论是数据库优化还是服务器配置,均结合真实场景与代码示例进行剖析,致力于提供可直接应用于工作的解决方案。
专业领域覆盖
精准对应开发生命周期。从前端界面到后端编程,从数据库操作到服务器运维,形成完整闭环,一站式满足全栈工程师和运维人员的技术需求。
即学即用高效
内容强调实操性,步骤清晰、代码完整。用户可根据教程直接复现和应用于自身项目,显著缩短从学习到实践的距离,快速解决开发中的具体问题。
持续更新保障
专注既定技术方向进行长期、稳定的内容输出。确保各栏目技术文章持续更新迭代,紧跟主流技术发展趋势,为用户提供经久不衰的学习价值。