如何用XSLT将XML元数据转为HTML iframe内的表格？

针对你用XSLT转换GIMP XML元数据却只输出连续文本的情况，结合新手常踩的坑，整理几个核心排查点：

1. 命名空间匹配错误 #

GIMP元数据XML肯定带有命名空间（比如xmlns:gimp="http://www.gimp.org/namespace/1.0"），如果XSLT里没正确声明或使用这个命名空间，会导致所有元素选择器失效，只能输出XML里的纯文本。

正确做法：
在XSLT的<xsl:stylesheet>标签里声明和XML完全一致的命名空间，并用前缀（比如gimp:）定位节点：

<xsl:stylesheet version="1.0" 
  xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
  xmlns:gimp="http://www.gimp.org/namespace/1.0"> <!-- 必须和XML的命名空间URI一致 -->

2. 未生成完整的表格HTML结构 #

如果XSLT里没明确输出<table>、<tr>、<th>、<td>这些标签，自然只会输出纯文本。

示例正确模板：
假设你的GIMP XML结构是：

<gimp:metadata xmlns:gimp="http://www.gimp.org/namespace/1.0">
  <gimp:entry>
    <gimp:description>图像尺寸</gimp:description>
    <gimp:value>1920x1080</gimp:value>
  </gimp:entry>
</gimp:metadata>

对应的XSLT要生成完整表格：

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" 
  xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
  xmlns:gimp="http://www.gimp.org/namespace/1.0">

  <!-- 指定输出为HTML格式 -->
  <xsl:output method="html" indent="yes"/>

  <!-- 匹配根节点，生成页面和表格框架 -->
  <xsl:template match="/">
    <html>
      <body>
        <table border="1">
          <tr>
            <th>Description</th>
            <th>Value</th>
          </tr>
          <!-- 遍历所有元数据项 -->
          <xsl:apply-templates select="//gimp:entry"/>
        </table>
      </body>
    </html>
  </xsl:template>

  <!-- 匹配每个元数据项，生成表格行 -->
  <xsl:template match="gimp:entry">
    <tr>
      <td><xsl:value-of select="gimp:description"/></td>
      <td><xsl:value-of select="gimp:value"/></td>
    </tr>
  </xsl:template>

  <!-- 覆盖XSLT默认文本输出模板，避免多余空白或无关文本 -->
  <xsl:template match="text()"/>
</xsl:stylesheet>

3. 输出方法设置错误 #

如果xsl:output的method设为text，XSLT会直接输出纯文本，忽略所有HTML标签。确认你的输出配置是：

<xsl:output method="html" indent="yes"/>

4. 未覆盖XSLT默认模板 #

XSLT自带的默认模板会遍历所有节点并输出文本内容，即使你写了自己的模板，未匹配的文本（比如XML里的换行、空格）也会被输出，导致内容混乱。添加这个模板可以屏蔽默认文本输出：

<xsl:template match="text()"/>

5. 动态转换的JS逻辑验证 #

虽然你说JS逻辑就绪，但可以检查转换后的结果是否正确插入iframe：

• 确保用transformToDocument()或transformToFragment()生成HTML文档片段，而非纯文本字符串。
• 插入iframe时，要设置iframe.contentDocument.body.appendChild(转换结果)，而不是直接赋值iframe.contentDocument.body.innerHTML（后者可能丢失部分结构）。

内容的提问来源于stack exchange，提问作者user20905730