Chuyển đổi các thẻ XML sang HTML

Bạn có thấy công cụ này hữu ích không? . Điều này sẽ giúp chúng tôi cải thiện các công cụ web miễn phí của mình


Đóng

Biểu mẫu này cho phép bạn chuyển đổi dữ liệu XML sang bảng HTML, dán hoặc tải lên tệp XML của bạn bên dưới

duyệt toàn màn hìnhthoát toàn màn hình mẫubản saoxóa


ConvertKết quả của bạn có thể được nhìn thấy dưới đây

Kết quả chuyển đổi XML sang HTML

tải xuống toàn màn hìnhthoát toàn màn hìnhsao chépxóa


Di chuyển đến SaveDi chuyển đến "Dán mã" để Lưu nó


Xem trước của bảng HTML

Ko có kết quả

Giới thiệu về chuyển đổi XML sang HTML

Giới thiệu về chuyển đổi dữ liệu XML sang bảng HTML

Trình chuyển đổi XML sang HTML được tạo để chuyển đổi trực tuyến dữ liệu XML (Ngôn ngữ đánh dấu mở rộng) thành bảng HTML. Đó là cách rất đơn giản và dễ dàng để chuyển đổi và chia sẻ mã XML thành mã HTML

Làm thế nào nó hoạt động?

Chỉ cần dán hoặc tải dữ liệu XML của bạn lên vùng văn bản ở trên và nhấp vào nút "Chuyển đổi" và bạn sẽ nhận được mã HTML ngay lập tức

Ví dụ về chuyển đổi XML sang HTML

Trước.
<artists>
    <artist>
        <id>1</id>
        <firstName>Dwayne</firstName>
        <lastName>Johnson</lastName>
        <age>47</age>
    </artist>
    <artist>
        <id>2</id>
        <firstName>Jessica</firstName>
        <lastName>Alba</lastName>
        <age>38</age>
    </artist>
    <artist>
        <id>3</id>
        <firstName>Peter</firstName>
        <lastName>Pan</lastName>
        <age>120</age>
    </artist>
</artists>
Sau.
<table>
	<thead>
		<tr>
			<td>id</td>
			<td>firstName</td>
			<td>lastName</td>
			<td>age</td>
		</tr>
	</thead>
	<tr>
		<td>1</td>
		<td>Dwayne</td>
		<td>Johnson</td>
		<td>47</td>
	</tr>
	<tr>
		<td>2</td>
		<td>Jessica</td>
		<td>Alba</td>
		<td>38</td>
	</tr>
	<tr>
		<td>3</td>
		<td>Peter</td>
		<td>Pan</td>
		<td>120</td>
	</tr>
	<tr>
		<td></td>
	</tr>
</table>
Sau khi chuyển đổi, bạn có thể áp dụng mã HTML cho dự án của mình hoặc sử dụng nó cho một số mục đích khác

Quyên tặng

Bạn có thích công cụ này? . Điều này sẽ giúp chúng tôi cải thiện các công cụ web miễn phí của mình

Paypal

Công cụ liên quan

Công cụ khai thác XML Trình định dạng XMLXác thực XMLChuyển đổi XML thành JSONXML Escape/UnescapeChuyển đổi XML sang PHP Array OnlineChuyển đổi XML thành CSVChuyển đổi XML thành TSVChuyển đổi XML thành Văn bản thuần túyChuyển đổi XML thành ExcelChuyển đổi XML thành PDFChuyển đổi XML thành SQLChuyển đổi XML thành YAML

Về chúng tôi

WTOOLS - bộ Công cụ web dành cho nhà phát triển, quản trị viên web, chuyên gia SEO và những người khác có hoạt động kinh doanh trực tuyến. Tất cả các công cụ là hoàn toàn miễn phí

Trong hướng dẫn này, chúng tôi sẽ mô tả cách chuyển đổi XML sang HTML bằng cách sử dụng các thư viện Java và công cụ mẫu phổ biến – JAXP, StAX, Freemarker và Mustache

2. Một XML thành Unmarshal

Hãy bắt đầu với một tài liệu XML đơn giản mà chúng ta sẽ sắp xếp lại thành một biểu diễn Java phù hợp trước khi chuyển đổi nó thành HTML. Chúng tôi sẽ ghi nhớ một vài mục tiêu chính

  1. Giữ cùng một XML cho tất cả các mẫu của chúng tôi
  2. Tạo một tài liệu HTML5 hợp lệ về mặt cú pháp và ngữ nghĩa ở cuối
  3. Chuyển đổi tất cả các phần tử XML thành văn bản

Hãy sử dụng một thông báo Jenkins đơn giản làm XML mẫu của chúng ta

<?xml version="1.0" encoding="UTF-8"?>
<notification>
    <from>[email protected]</from>
    <heading>Build #7 passed</heading>
    <content>Success: The Jenkins CI build passed</content>
</notification>

Và nó khá đơn giản. Nó bao gồm một phần tử gốc và một số phần tử lồng nhau

Chúng tôi sẽ cố gắng xóa tất cả các thẻ XML duy nhất và in ra các cặp khóa-giá trị khi chúng tôi tạo tệp HTML của mình

3. JAXP

Kiến trúc Java để xử lý XML (JAXP) là một thư viện nhằm mở rộng chức năng của Trình phân tích cú pháp SAX phổ biến với hỗ trợ DOM bổ sung. JAXP cung cấp khả năng sắp xếp và sắp xếp các đối tượng được xác định bằng XML vào và từ các POJO bằng cách sử dụng Trình phân tích cú pháp SAX. Chúng tôi cũng sẽ sử dụng trình trợ giúp DOM tích hợp

Hãy thêm phần phụ thuộc Maven cho JAXP vào dự án của chúng ta

<dependency>
    <groupId>javax.xml</groupId>
    <artifactId>jaxp-api</artifactId>
    <version>1.4.2</version>
</dependency>

3. 1. Sắp xếp lại bằng cách sử dụng Trình tạo DOM

Trước tiên, hãy bắt đầu sắp xếp lại tệp XML của chúng ta thành một đối tượng Phần tử Java

DocumentBuilderFactory factory = DocumentBuilderFactory.newInstance();
factory.setFeature(XMLConstants.FEATURE_SECURE_PROCESSING, true);
factory.setFeature("http://apache.org/xml/features/disallow-doctype-decl", true);

Document input = factory
  .newDocumentBuilder()
  .parse(resourcePath);
Element xml = input.getDocumentElement();

3. 2. Trích xuất nội dung tệp XML trong bản đồ

Bây giờ, hãy tạo Bản đồ với nội dung có liên quan của tệp XML của chúng tôi

Map<String, String> map = new HashMap<>();
map.put("heading", 
  xml.getElementsByTagName("heading")
    .item(0)
    .getTextContent());
map.put("from", String.format("from: %s",
  xml.getElementsByTagName("from")
    .item(0)
    .getTextContent()));
map.put("content", 
  xml.getElementsByTagName("content")
    .item(0)
    .getTextContent());

3. 3. Marshalling Sử dụng DOM Builder

Marshalling XML của chúng tôi thành một tệp HTML liên quan nhiều hơn một chút

Hãy chuẩn bị một Tài liệu chuyển giao mà chúng ta sẽ sử dụng để viết ra HTML

Document doc = factory
  .newDocumentBuilder()
  .newDocument();

Tiếp theo, chúng tôi sẽ điền Tài liệu với các Thành phần trong bản đồ của chúng tôi

Element html = doc.createElement("html");

Element head = doc.createElement("head");
html.setAttribute("lang", "en");

Element title = doc.createElement("title");
title.setTextContent(map.get("heading"));

head.appendChild(title);
html.appendChild(head);

Element body = doc.createElement("body");

Element from = doc.createElement("p");
from.setTextContent(map.get("from"));

Element success = doc.createElement("p");
success.setTextContent(map.get("content"));

body.appendChild(from);
body.appendChild(success);

html.appendChild(body);
doc.appendChild(html);

Cuối cùng, hãy sắp xếp đối tượng Tài liệu của chúng ta bằng TransformerFactory

________số 8_______

Nếu chúng ta gọi đầu ra. toString(), chúng ta sẽ nhận được biểu diễn HTML

Lưu ý rằng một số tính năng và thuộc tính bổ sung mà chúng tôi đặt trên nhà máy của mình được lấy từ các đề xuất của dự án OWASP để tránh tiêm XXE

4. stAX

Một thư viện khác mà chúng ta có thể sử dụng là Streaming API for XML (StAX). Giống như JAXP, StAX đã có từ rất lâu — từ năm 2004

Hai thư viện khác đơn giản hóa việc phân tích tệp XML. Điều đó thật tuyệt vời đối với các nhiệm vụ hoặc dự án đơn giản nhưng sẽ kém hơn khi chúng ta cần lặp lại hoặc có quyền kiểm soát rõ ràng và chi tiết đối với chính việc phân tích cú pháp phần tử. Đó là nơi StAX có ích

Hãy thêm phần phụ thuộc Maven cho API StAX vào dự án của chúng ta

<dependency>
    <groupId>javax.xml.stream</groupId>
    <artifactId>stax-api</artifactId>
    <version>1.0-2</version>
</dependency>

4. 1. Sắp xếp lại bằng StAX

Chúng tôi sẽ sử dụng luồng điều khiển lặp lại đơn giản để lưu trữ các giá trị XML vào Bản đồ của chúng tôi

XMLInputFactory factory = XMLInputFactory.newInstance();
factory.setProperty(XMLInputFactory.IS_SUPPORTING_EXTERNAL_ENTITIES, Boolean.FALSE);
factory.setProperty(XMLInputFactory.SUPPORT_DTD, Boolean.FALSE);
XMLStreamReader input = null;
try (FileInputStream file = new FileInputStream(resourcePath)) {
    input = factory.createXMLStreamReader(file);

    Map<String, String> map = new HashMap<>();
    while (input.hasNext()) {
        input.next();
        if (input.isStartElement()) {
            if (input.getLocalName().equals("heading")) {
                map.put("heading", input.getElementText());
            }
            if (input.getLocalName().equals("from")) {
                map.put("from", String.format("from: %s", input.getElementText()));
            }
            if (input.getLocalName().equals("content")) {
                map.put("content", input.getElementText());
            }
        }
    }
} finally {
    if (input != null) {
        input.close();
    }
}

4. 2. Marshalling Sử dụng StAX

Bây giờ, hãy sử dụng bản đồ của chúng ta và viết ra HTML

try (Writer output = new StringWriter()) {
    XMLStreamWriter writer = XMLOutputFactory
      .newInstance()
      .createXMLStreamWriter(output);

    writer.writeDTD("<!DOCTYPE html>");
    writer.writeStartElement("html");
    writer.writeAttribute("lang", "en");
    writer.writeStartElement("head");
    writer.writeDTD("<META http-equiv=\"Content-Type\" content=\"text/html; charset=UTF-8\">");
    writer.writeStartElement("title");
    writer.writeCharacters(map.get("heading"));
    writer.writeEndElement();
    writer.writeEndElement();

    writer.writeStartElement("body");

    writer.writeStartElement("p");
    writer.writeCharacters(map.get("from"));
    writer.writeEndElement();

    writer.writeStartElement("p");
    writer.writeCharacters(map.get("content"));
    writer.writeEndElement();

    writer.writeEndElement();
    writer.writeEndDocument();
    writer.flush();
}

Giống như trong ví dụ JAXP, chúng ta có thể gọi đầu ra. toString() để lấy biểu diễn HTML

5. Sử dụng Công cụ Mẫu

Để thay thế cho việc viết biểu diễn HTML, chúng ta có thể sử dụng các công cụ mẫu. Có nhiều tùy chọn trong hệ sinh thái Java. Hãy khám phá một số trong số họ

5. 1. Sử dụng Apache Freemarker

Apache FreeMarker là một công cụ mẫu dựa trên Java để tạo đầu ra văn bản (trang web HTML, e-mail, tệp cấu hình, mã nguồn, v.v. ) dựa trên mẫu và thay đổi dữ liệu

Để sử dụng nó, chúng tôi sẽ cần thêm phụ thuộc freemarker vào dự án Maven của chúng tôi

<dependency>
    <groupId>javax.xml</groupId>
    <artifactId>jaxp-api</artifactId>
    <version>1.4.2</version>
</dependency>
0

Trước tiên, hãy tạo một mẫu bằng cú pháp FreeMarker

<dependency>
    <groupId>javax.xml</groupId>
    <artifactId>jaxp-api</artifactId>
    <version>1.4.2</version>
</dependency>
1

Bây giờ, hãy sử dụng lại bản đồ của chúng ta và điền vào các khoảng trống trong mẫu

<dependency>
    <groupId>javax.xml</groupId>
    <artifactId>jaxp-api</artifactId>
    <version>1.4.2</version>
</dependency>
2

5. 2. sử dụng ria mép

Mustache là một công cụ tạo mẫu không logic. Bộ ria mép có thể được sử dụng cho HTML, tệp cấu hình, mã nguồn - gần như mọi thứ. Nó hoạt động bằng cách mở rộng các thẻ trong một mẫu sử dụng các giá trị được cung cấp trong hàm băm hoặc đối tượng

Để sử dụng nó, chúng ta cần thêm phụ thuộc ria mép vào dự án Maven của mình

<dependency>
    <groupId>javax.xml</groupId>
    <artifactId>jaxp-api</artifactId>
    <version>1.4.2</version>
</dependency>
3

Hãy bắt đầu tạo một mẫu bằng cú pháp Mustache

<dependency>
    <groupId>javax.xml</groupId>
    <artifactId>jaxp-api</artifactId>
    <version>1.4.2</version>
</dependency>
4

Bây giờ, hãy điền vào mẫu bằng bản đồ của chúng tôi

<dependency>
    <groupId>javax.xml</groupId>
    <artifactId>jaxp-api</artifactId>
    <version>1.4.2</version>
</dependency>
5

6. HTML kết quả

Cuối cùng, với tất cả các mẫu mã của chúng tôi, chúng tôi sẽ nhận được cùng một đầu ra HTML

<dependency>
    <groupId>javax.xml</groupId>
    <artifactId>jaxp-api</artifactId>
    <version>1.4.2</version>
</dependency>
6

7. Phần kết luận

Trong hướng dẫn này, chúng ta đã học những kiến ​​thức cơ bản về cách sử dụng JAXP, StAX, Freemarker và Mustache để chuyển đổi XML thành HTML

Để biết thêm thông tin về XML trong Java, hãy xem các tài nguyên tuyệt vời khác ngay tại đây trên Baeldung

Bạn có thể chuyển đổi XML sang HTML không?

Người dùng cũng có thể chuyển đổi Tệp XML thành HTML bằng cách tải tệp lên . XML sang HTML Online hoạt động tốt trên Windows, MAC, Linux, Chrome, Firefox, Edge và Safari.

Làm cách nào để hiển thị các thẻ XML trong trang HTML?

Để xem XML thô, bạn phải nhấp chuột phải vào trang và chọn "Xem nguồn" .

Làm cách nào để chuyển đổi XML thành bảng HTML?

Đọc tệp XML. .
Thêm bảng làm thành phần gốc, nếu bạn muốn thêm thuộc tính đường viền, chỉ cần sử dụng XAttribute
Thêm thead, tbody làm phần tử con vào phần tử bảng
Thêm tr làm phần tử con vào thead và đặt tên cột bằng cách thêm th làm phần tử con vào tr

Làm cách nào để tạo tệp HTML từ XML?

Để tạo tài liệu HTML từ tệp Lược đồ XML. .
Trong dạng xem Bộ điều hướng, bấm chuột phải vào tệp Lược đồ XML mà bạn muốn sử dụng để tạo tài liệu HTML
Nhấp vào Tạo > HTML. .
Chọn kiểu tài liệu HTML mà bạn muốn. .
Chỉ định vị trí cho tài liệu HTML của bạn