Tạo bởi Trần Văn Điêp|

Học PHP

[XML] Tìm hiểu XSLT - Ứng dụng trong mô hình phát triển MVC

Giới thiệu

Trong thế giới phát triển web và phần mềm hiện đại, XML (eXtensible Markup Language) không chỉ là một định dạng dữ liệu, mà còn là nền tảng cho nhiều công nghệ quan trọng khác như XSLT, XPath, SOAP, và Web Services.
Khi nhắc đến việc biến đổi dữ liệu XML thành giao diện người dùng (HTML) hay định dạng khác, không thể không nói đến XSLT (Extensible Stylesheet Language Transformations).

Vậy XSLT là gì, nó liên quan gì đến mô hình MVC, và cách ứng dụng nó trong lập trình web ra sao?

Bài viết này sẽ giúp bạn:

Hiểu khái niệm, vai trò, và cú pháp cơ bản của XSLT.
Nắm rõ cách hoạt động của XSLT khi chuyển đổi XML sang HTML.
Thấy rõ mối liên hệ giữa XSLT và mô hình MVC (Model - View - Controller).
Thực hành với ví dụ cụ thể từ bộ mã student.xml và student.xsl.

XSLT là gì?

XSLT (Extensible Stylesheet Language Transformations) là một ngôn ngữ dùng để chuyển đổi tài liệu XML thành định dạng khác, chẳng hạn như HTML, XML khác, JSON, hoặc văn bản thuần.

Hiểu đơn giản:

XSLT là “bản thiết kế giao diện” giúp XML – vốn chỉ là dữ liệu thô – trở nên có hình thức hiển thị đẹp mắt và dễ hiểu.

Ví dụ:

Một file student.xml chứa danh sách học sinh.
Một file student.xsl định nghĩa cách hiển thị danh sách đó dưới dạng bảng HTML.

Khi trình duyệt đọc XML có liên kết XSL, nó sẽ kết hợp hai file lại và hiển thị giao diện HTML tự động.

Cấu trúc cơ bản của XSLT

Một tài liệu XSLT thường có cấu trúc như sau:


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

	<xsl:template match="/">
		<!-- Nội dung HTML hoặc kết quả sau khi transform -->
	</xsl:template>

</xsl:stylesheet>

Giải thích:

xsl:stylesheet: thẻ gốc của tài liệu XSLT.
xmlns:xsl: namespace mặc định của ngôn ngữ XSL.
xsl:template match="/": định nghĩa template chính – tức là bắt đầu xử lý từ gốc của tài liệu XML (/ nghĩa là toàn bộ file).

Liên kết XML và XSLT

Trong file XML, để liên kết với stylesheet XSL, ta dùng dòng khai báo:


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

Điều này giúp trình duyệt hiểu rằng:

Khi mở file XML, hãy áp dụng file student.xsl để hiển thị nội dung.

Ví dụ thực tế: Hiển thị danh sách sinh viên từ XML bằng XSLT

File 1 – student.xml


<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="student.xsl"?>

<studentList>
	<student>
		<fullname>TRAN VAN A</fullname>
		<age>12</age>
		<address>Ha Noi</address>
		<email>a@gmail.com</email>
		<gender>Nam</gender>
	</student>
	<student>
		<fullname>TRAN VAN B</fullname>
		<age>12</age>
		<address>Ha Noi</address>
		<email>a@gmail.com</email>
		<gender>Nam</gender>
	</student>
	<student>
		<fullname>TRAN VAN C</fullname>
		<age>12</age>
		<address>Ha Noi</address>
		<email>a@gmail.com</email>
		<gender>Nam</gender>
	</student>
</studentList>

File 2 – student.xsl


<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<html> 
<body>
  <h2>DANH SÁCH SINH VIÊN</h2>
  <table border="1">
    <tr bgcolor="#9acd32">
      <th>Họ tên</th>
      <th>Tuổi</th>
      <th>Địa chỉ</th>
      <th>Email</th>
      <th>Giới tính</th>
    </tr>
    <xsl:for-each select="studentList/student">
    <tr>
      <td><xsl:value-of select="fullname"/></td>
      <td><xsl:value-of select="age"/></td>
      <td><xsl:value-of select="address"/></td>
      <td><xsl:value-of select="email"/></td>
      <td><xsl:value-of select="gender"/></td>
    </tr>
    </xsl:for-each>
  </table>
</body>
</html>
</xsl:template>
</xsl:stylesheet>

Khi mở file student.xml trên trình duyệt, bạn sẽ thấy một bảng HTML hiển thị danh sách sinh viên, được tạo tự động bởi XSLT.

Phân tích hoạt động của XSLT

Tìm và áp dụng template gốc (match="/")
→ Bắt đầu xử lý toàn bộ cây XML.
Duyệt qua từng phần tử student
```
<xsl:for-each select="studentList/student">
```
→ Vòng lặp for-each giúp lặp lại phần tử student trong studentList.
Lấy giá trị của từng node con
```
<xsl:value-of select="fullname"/>
```
→ Lấy giá trị của thẻ <fullname> hiện tại và hiển thị trong bảng HTML.
Xuất HTML hoàn chỉnh
→ Sau khi xử lý toàn bộ, trình duyệt hiển thị dữ liệu theo đúng cấu trúc trong file XSLT.

Ưu điểm khi dùng XSLT

✅ Tách biệt dữ liệu và giao diện hiển thị: XML chứa dữ liệu, XSL định nghĩa cách hiển thị.
✅ Tái sử dụng dễ dàng: Có thể áp dụng một XSL cho nhiều XML khác nhau.
✅ Hỗ trợ mô hình MVC: XSL đóng vai trò View trong cấu trúc MVC.
✅ Hoạt động độc lập: Không cần backend server, chỉ cần trình duyệt có hỗ trợ XML/XSLT.
✅ Có thể xuất ra nhiều định dạng khác nhau: HTML, CSV, JSON, hoặc XML mới.

Nhược điểm của XSLT

❌ Cú pháp hơi phức tạp với người mới học XML.
❌ Khó bảo trì khi dữ liệu lớn và nhiều cấp độ lồng nhau.
❌ Hạn chế trong việc xử lý logic phức tạp (if, for nâng cao).
❌ Các trình duyệt hiện đại (Chrome, Edge) đôi khi không hiển thị XSLT trực tiếp — cần server để transform.

Ứng dụng XSLT trong mô hình MVC

Mô hình MVC (Model – View – Controller) là kiến trúc phổ biến trong lập trình web và phần mềm.
Cùng xem XSLT đóng vai trò gì trong mô hình này:

Thành phần	Vai trò	Ví dụ trong bài
Model	Lưu trữ dữ liệu (XML)	`student.xml`
View	Hiển thị dữ liệu (XSLT/HTML)	`student.xsl`
Controller	Điều khiển luồng xử lý (PHP, Java, Node.js...)	`vidu.html` hoặc file PHP gọi XML + XSL

Luồng hoạt động:

Controller (PHP) đọc dữ liệu từ CSDL hoặc API, lưu thành file XML (Model).
Controller áp dụng XSLT (View) để chuyển XML → HTML.
Kết quả cuối cùng gửi tới người dùng (trình duyệt).

Ví dụ tích hợp XSLT vào PHP (Controller)


<?php
// Controller xử lý XSLT trong PHP
$xml = new DOMDocument;
$xml->load('student.xml');

$xsl = new DOMDocument;
$xsl->load('student.xsl');

// Khởi tạo XSLT processor
$proc = new XSLTProcessor;
$proc->importStyleSheet($xsl);

// Xuất kết quả HTML ra màn hình
echo $proc->transformToXML($xml);
?>

Kết quả: PHP sẽ đọc student.xml, áp dụng student.xsl, và hiển thị bảng HTML hoàn chỉnh.

Lợi ích khi áp dụng XSLT trong MVC

Tăng tính module hóa
- Mỗi phần (Model, View, Controller) hoạt động độc lập.
- Dễ dàng thay đổi giao diện mà không ảnh hưởng đến dữ liệu.
Tái sử dụng giao diện cho nhiều loại dữ liệu khác nhau
- Một file XSL có thể hiển thị nhiều file XML cùng cấu trúc.
Hỗ trợ đa định dạng xuất
- Có thể tạo thêm XSL khác để xuất XML → CSV, PDF, JSON...
Giúp kiểm thử và bảo trì dễ dàng
- Dữ liệu và giao diện tách biệt → dễ test riêng từng phần.

Tại sao nên học XSLT dù JSON đang phổ biến?

Nhiều lập trình viên hiện nay chỉ chú trọng JSON, mà quên rằng XSLT vẫn là nền tảng mạnh mẽ trong các hệ thống lớn như:

Chính phủ, ngân hàng, bảo hiểm.
Các phần mềm ERP, CRM, hoặc doanh nghiệp dùng XML làm giao thức chuẩn.
Ứng dụng Android/JavaEE, nơi file cấu hình (Manifest, Layout) vẫn dùng XML.

Hiểu được XSLT giúp bạn:

Đọc hiểu nhanh cấu trúc file XML phức tạp.
Biết cách tạo View động mà không cần JavaScript.
Giao tiếp được với các hệ thống backend cũ dùng XML.

Một số lệnh thường dùng trong XSLT

Câu lệnh	Chức năng
`<xsl:value-of select="node"/>`	Lấy giá trị của node
`<xsl:for-each select="path">...</xsl:for-each>`	Lặp qua các phần tử
`<xsl:if test="condition">...</xsl:if>`	Điều kiện if
`<xsl:choose> <xsl:when test=""> ... </xsl:when> <xsl:otherwise>...</xsl:otherwise> </xsl:choose>`	Cấu trúc điều kiện nhiều nhánh
`<xsl:sort select="path"/>`	Sắp xếp dữ liệu
`<xsl:apply-templates/>`	Gọi template con
`<xsl:output method="html"/>`	Định dạng đầu ra

So sánh XSLT với HTML + PHP thông thường

Tiêu chí	XSLT	HTML + PHP
Cấu trúc dữ liệu	XML rõ ràng	Tùy ý
Tách biệt dữ liệu và giao diện	Rõ ràng	Thường lẫn lộn
Tốc độ xử lý	Nhanh với dữ liệu nhỏ	Linh hoạt với dữ liệu lớn
Học dễ không	Hơi khó cho người mới	Dễ học
Ứng dụng	XML-based system, MVC, WebService	Hầu hết ứng dụng web

Thực hành nâng cao: Kết hợp XSLT + AJAX

Bạn có thể dùng AJAX để tải file XML, sau đó áp dụng XSLT ngay trên trình duyệt mà không cần server.


let xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
  if (this.readyState == 4 && this.status == 200) {
    let xml = this.responseXML;
    displayResult(xml);
  }
};
xhttp.open("GET", "student.xml", true);
xhttp.send();

function displayResult(xml) {
  let xslt = new XMLHttpRequest();
  xslt.open("GET", "student.xsl", false);
  xslt.send();
  let xsl = xslt.responseXML;

  let xsltProcessor = new XSLTProcessor();
  xsltProcessor.importStylesheet(xsl);
  let result = xsltProcessor.transformToFragment(xml, document);
  document.body.appendChild(result);
}

Kết luận

XSLT là một công nghệ tuy “cũ” nhưng cực kỳ hiệu quả và mạnh mẽ khi làm việc với dữ liệu XML.
Trong mô hình MVC, XSLT đảm nhiệm vai trò View, giúp hiển thị dữ liệu từ XML một cách rõ ràng, tách biệt và có thể mở rộng.

Qua ví dụ student.xml và student.xsl, bạn đã thấy:

Cách tạo XML có cấu trúc dữ liệu chuẩn.
Cách thiết kế giao diện HTML từ XSLT.
Cách kết hợp XSLT vào PHP và mô hình MVC.

👉 Hãy thực hành ngay bằng cách:

Tạo file student.xml và student.xsl.
Mở student.xml bằng trình duyệt hoặc PHP.
Quan sát kết quả và thử thêm cột mới (VD: “Điểm trung bình”).

Nếu bạn hiểu được luồng dữ liệu XML → XSLT → HTML, thì bạn đã nắm vững một phần cốt lõi của mô hình MVC và cách tách biệt dữ liệu – giao diện trong lập trình web.