XSL

最新推荐文章于 2025-08-12 14:37:12 发布

最新推荐文章于 2025-08-12 14:37:12 发布 · 158 阅读

文章标签：

#xhtml #javascript #ViewUI

XML 专栏收录该内容

2 篇文章

订阅专栏

本文介绍如何使用XSL将XML数据转换为HTML页面，包括一个简单的XML示例、对应的XSL模板以及如何在浏览器中实现转换的过程。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

XSL：把xml转化成html

官方教程：

http://www.w3school.com.cn/xsl/xsl_templates.asp

1.xml

<?xml version="1.0" encoding="ISO-8859-1"?>
<?xml-stylesheet type="text/xsl" href="2.xsl"?>
<catalog>
	<cd>
		<title>Empire Burlesque</title>
		<artist>Bob Dylan</artist>
		<country>USA</country>
		<company>Columbia</company>
		<price>10.90</price>
		<year>1985</year>
	</cd>
	<cd>
		<title>Hide your heart</title>
		<artist>Bonnie Tyler</artist>
		<country>UK</country>
		<company>CBS Records</company>
		<price>9.90</price>
		<year>1988</year>
	</cd>
	<cd>
		<title>Greatest Hits</title>
		<artist>Dolly Parton</artist>
		<country>USA</country>
		<company>RCA</company>
		<price>9.90</price>
		<year>1982</year>
	</cd>

</catalog>

2.xsl

<?xml version="1.0" encoding="ISO-8859-1"?>

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

<xsl:template match="/">
  <html>
  <body>
    <h2>My CD Collection</h2>
    <table border="1">
    <tr bgcolor="#9acd32">
      <th align="left">Title</th>
      <th align="left">Artist</th>
    </tr>
    <xsl:for-each select="catalog/cd">
    <tr>
      <td><xsl:value-of select="title"/></td>
      <td><xsl:value-of select="artist"/></td>
    </tr>
    </xsl:for-each>
    </table>
  </body>
  </html>
</xsl:template>

</xsl:stylesheet>

3. 打开xml

转换前：

转换后：

4. 合法的过滤运算符:

= (等于)
!= (不等于)
< (小于)
> (大于)

 <xsl:for-each select="catalog/cd">
      <xsl:if test="price &gt; 10">
        <tr>
          <td><xsl:value-of select="title"/></td>
          <td><xsl:value-of select="artist"/></td>
        </tr>
      </xsl:if>
      </xsl:for-each>

5.在浏览器中把 XML 转换为 XHTML

<html>
<body>

<script type="text/javascript">

// Load XML 
var xml = new ActiveXObject("Microsoft.XMLDOM")
xml.async = false
xml.load("cdcatalog.xml")

// Load XSL
var xsl = new ActiveXObject("Microsoft.XMLDOM")
xsl.async = false
xsl.load("cdcatalog.xsl")

// Transform
document.write(xml.transformNode(xsl))

</script>

</body>
</html>