XSLT - Chuyển Đổi XML Thành HTML

23/09/2020•4 min read

Giới thiệu Extensible Stylesheet Language - XSL, XSLT, cấu trúc tài liệu XSLT và các thao tác với XSLT. Hướng dẫn sử dụng eXtensible Style Sheet để transform một tài liệu XML thành HTML.

Giới thiệu

XML là một ngôn ngữ phục vụ cho việc mô tả và trao đổi dữ liệu, tuy nhiên với tốc độ phát triển của công nghệ hiện nay XML cần thêm một số công cụ hỗ trợ để phát huy được tối đa sức mạnh của mình. Một trong số đó là eXtensible Style Sheet một ngôn ngữ có thể transform một tài liệu XML thành các định dạng khác.

Bài viết giới thiệu về extensible stylesheet language, một ngôn ngữ dựa trên nền tảng của XML nhằm tạo ra các stylesheet có thể linh hoạt biến đổi cấu trúc của tài liệu XML phù hợp với nhiều mục đích khác nhau.

Extensible Stylesheet Language (XSL)

XSL là một ngôn ngữ được xây dựng dựa trên nền tảng ngôn ngữ XML có thể linh hoạt chuyển đổi XML thành các định dạng khác tùy theo mục đích hiển thị. XSL bao gồm 3 phần:

XSL Transformation (XSLT)

Là ngôn ngữ dùng để chuyển đổi XML thành định dạng khác như: HTML, Wireless Markup Language và thậm chí là một tài liệu XML với cấu trúc mới.

Cấu trúc của một tài liệu XSLT

Một tài liệu XSLT được lưu trong file có định dạng *.xsl. Có cấu trúc tổng quát:

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

</xsl:stylesheet>

Trong một tài liệu XSLT element <xsl:stylesheet> chính là element root của tài liệu.

Khai báo XSLT vào một tài liệu XML

Để khai báo XSLT trong một tài liệu XML:

<?xml-stylesheet type="text/xsl" href="uri"?>

Làm quen với XSLT

Lệnh value-of

Lệnh value-of dùng để lấy dữ liệu của thẻ hiện hành và đưa nó vào tài liệu output.

Cú pháp của lệnh value-of:

<xsl:value-of select="expression" />

với select dùng để khai báo element cần lấy giá trị.

Lệnh for-each

Lệnh for-each dùng để khai báo một vòng lặp cho các element giống nhau.

Cú pháp của lệnh for-each:

<xsl:for-each select="expression">
…
</xsl:for-each>

Lệnh attribute

Lệnh attribute dùng để đưa 1 attribute vào tài liệu output với giá trị được lấy theo số liệu ở tài liệu gốc.

Cú pháp của lệnh attribute:

<xsl:attribute name="attribute_name">
…
</xsl:attribute>

Các lệnh về điều kiện

Nếu đã quen với ngôn ngữ lập trình thì lệnh điều khiển của XSLT cũng tương đối giống với lệnh điều trong các ngôn ngữ lập trình. XSLT cung cấp 2 lệnh về điệu kiện là lệnh if và lệnh choose.

Cú pháp lệnh if:

<xsl:if test="expression"> … </xsl:if>

Cú pháp lệnh choose:

<xsl:choose>
	<xsl:when test=”expression>
		…
	</xsl:when>
		…
	<xsl:otherwise>
		…
	</xsl:otherwise>
</xsl:choose>

Ví dụ

Một tài liệu XML: article.xml

<?xml version="1.0" encoding="UTF-8"?>
<list>
	<article id="65">
		<author>Hòa Đinh</author>
		<title>Conditional Compilation Directives Giải Quyết Xung Đột Include</title>
		<link>http://www.stdio.vn/articles/read/65-conditional-compilation-directives-giai-quyet-xung-dot-include</link>
		<publish_date>23/09/14</publish_date>
		<description>#include, một chỉ thị hết sức quen thuộc với bất cứ lập trình viên nào đã và đang làm việc với ngôn ngữ C/C++.</description>
	</article>
	<article id="64">
		<author>La Kiến Vinh</author>
		<title>So Sánh null Và Rỗng</title>
		<link>http://www.stdio.vn/articles/read/64-so-sanh-null-va-rong</link>
		<publish_date>22/09/14</publish_date>
		<description>KHÔNG TỒN TẠI và TỒN TẠI CÁI KHÔNG là 2 khái niệm khác nhau nhưng dễ gây nhầm lẫn.</description>
	</article>
</list>

Tài liệu XML này mô tả thông tin tốt, tuy nhiên với trường hợp list chứa quá nhiều element article, việc theo dõi dữ liệu bên trong tài liệu hết sức khó khăn, do đó sẽ tạo một tài liệu XSLT để chuyển dữ liệu bên trong tài liệu XML thành một tài liệu HTML sau đó sử dụng trình duyệt web để theo dõi nội dung bên trong.

Tài liệu XSLT: article.xsl

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
	<xsl:template match="/">
		<HTML>
			<HEAD>
				<TITLE>Newest Articles</TITLE>
			</HEAD>
			<BODY>
				<Center>
					<H1>Newest Articles</H1>
				</Center>
				<TABLE Border="1">
					<TR align="center" bgcolor="silver">
						<TD>
							<b>ID</b>
						</TD>
						<TD>
							<b>Author</b>
						</TD>
						<TD>
							<b>Title</b>
						</TD>
						<TD>
							<b>Published Date</b>
						</TD>
						<TD>
							<b>Description</b>
						</TD>
					</TR>
					<xsl:for-each select="//article">
						<TR>
							<xsl:if test="@id mod 2 = 0">
								<xsl:attribute name="bgcolor">cyan</xsl:attribute>
							</xsl:if>
							<TD>
								<xsl:value-of select="@id" />
							</TD>
							<TD>
								<xsl:value-of select="author" />
							</TD>
							<TD>
								<A>
									<xsl:attribute name="HREF">
										<xsl:value-of select="link" />
									</xsl:attribute>
									<xsl:value-of select="title" />
								</A>
							</TD>
							<TD>
								<xsl:value-of select="publish_date" />
							</TD>
							<TD>
								<xsl:value-of select="description" />
							</TD>
						</TR>
					</xsl:for-each>
				</TABLE>
			</BODY>
		</HTML>
	</xsl:template>
</xsl:stylesheet>

Thêm chỉ thị : <?xml-stylesheet type="text/xsl" href="article.xsl"?> vào tài liệu XML để nhúng tài liệu XSLT vào. Sau đó mở tài liệu XML bằng trình duyệt web.

XSLT đã transfer tài liệu XML gốc thành một tài liệu HTML, thông qua cách hiển thị của HTML có thể dễ dàng theo dõi được nội dung bên trong của tài liệu XML ban đầu.