在 C# 中建立 HTML 表格

HTML 表格是一種在網頁上顯示資料的通用且強大的方式。它們可用於建立簡單的表格(例如日曆)或更複雜的表格(例如資料網格)。在這篇文章中，我們將逐步學習如何在 C# 中建立 HTML 表格。本指南將為您提供在 C# 中有效建立 HTML 表格所需的知識和技能。

本文涵蓋以下主題：

  1. 用於建立 HTML 表格的 C# API
  2. 在 C# 中建立 HTML 表格
  3. 在C#中建立帶有樣式屬性的HTML表格
  4. C# 中具有 rowspan 和 colspan 的 HTML 表格
  5. 線上 HTML 表格產生器
  6. 免費學習資源

用於建立 HTML 表的 C# API

我們將使用 Aspose.HTML for .NET 在 C# 中建立 HTML 表格。它允許開發人員以程式設計方式操作和使用 HTML 文件。它提供了廣泛的特性和功能，用於在 .NET 應用程式中解析、轉換、編輯和呈現 HTML 文件。

請下載 API 的 DLL 或使用 NuGet 安裝它。

PM> Install-Package Aspose.Html

在 C# 中建立 HTML 表格

我們可以按照以下步驟建立 HTML 表格：

  1. 建立 HTMLDocument 類別的實例。
  2. (可選)建立一個樣式元素並將其附加到 head 元素。
  3. 創建<table> ,<tbody> ,<tr> ,<th> 、和<td> 使用 CreateElement() 方法的元素。
  4. 使用 AppendChild() 方法將子元素追加到其父元素。
  5. 之後，附加<table> 元素到 <body> 元素。
  6. 最後，呼叫 Save() 方法將文件保存在給定的文件路徑中。

以下程式碼範例示範如何在 C# 中建立 HTML 表。

// 準備編輯文件儲存路徑 
string savePath = "C:\\Files\\Table.html";

// 初始化一個空的 HTML 文檔
var document = new HTMLDocument();

// 建立樣式元素並為表格元素指派顏色 border-style 和 border-color 值
var style = document.CreateElement("style");
style.TextContent = "table, th, td { border: 1px solid #0000ff; }";

// 找到文檔頭元素並將樣式元素附加到頭部
var head = document.GetElementsByTagName("head").First();
head.AppendChild(style);

// 宣告一個引用的變數體<body>元素
var body = document.Body;

// 指定列和行
var cols = 3;
var rows = 2;
var isFirstRowHeader = false;

// 建立表格元素
var table = document.CreateElement("table");

// 建立表體
var tbody = document.CreateElement("tbody");
table.AppendChild(tbody);

// 建立表格標題行 
if (isFirstRowHeader)
{
    var tr = document.CreateElement("tr");
    tbody.AppendChild(tr);

    // 建立表標題列 
   for (int j = 1; j < cols + 1; j++)
    {
        var th = document.CreateElement("th");
        var title = document.CreateTextNode("Column-" + j);
        th.AppendChild(title);
        tr.AppendChild(th);
    }

   for (int i = 0; i < rows - 1; i++)
    {
        // 建立表行 
        var dataTr = document.CreateElement("tr");
        tbody.AppendChild(dataTr);

        // 建立表格標題儲存格
       for (int j = 1; j < cols + 1; j++)
        {
            var td = document.CreateElement("td");
            var title = document.CreateTextNode("Data-" + j);
            td.AppendChild(title);
            dataTr.AppendChild(td);
        }
    }
} 
else
{
   for (int i = 0; i < rows; i++)
    {
        // 建立表行 
        var dataTr = document.CreateElement("tr");
        tbody.AppendChild(dataTr);

        // 建立表格單元格
       for (int j = 1; j < cols + 1; j++)
        {
            var td = document.CreateElement("td");
            var title = document.CreateTextNode("Data-" + j);
            td.AppendChild(title);
            dataTr.AppendChild(td);
        }
    }
}

// 將表格附加到正文
body.AppendChild(table);

// 將文件儲存到文件
document.Save(savePath);
在 C# 中建立 HTML 表格

在 C# 中建立 HTML 表格

在 C# 中建立帶有樣式屬性的 HTML 表

我們可以按照前面提到的步驟來建立一個 HTML 表格。但是，我們需要設定 <style> attributes for the elements using the SetAttribute(string name, string value) method. It adds a new attribute for the element or updates the value if the attribute name is already present. We can set attributes for <table>, <tbody>, <tr>, <th>, and <td> elements.

以下程式碼範例示範如何在 C# 中建立具有樣式屬性的 HTML 表。

// 準備編輯文件儲存路徑 
string savePath = "C:\\Files\\TableWithStyle.html";

// 初始化一個空的 HTML 文檔
using var document = new HTMLDocument();

// 建立樣式元素並為表格元素指派顏色 border-style 和 border-color 值
var style = document.CreateElement("style");
style.TextContent = "table, th, td { border: 1px solid #0000ff; border-collapse: collapse;}";

// 找到文檔頭元素並將樣式元素附加到頭部
var head = document.GetElementsByTagName("head").First();
head.AppendChild(style);

// 宣告一個引用的變數體<body>元素
var body = document.Body;

// 建立表格元素
var table = document.CreateElement("table");
table.SetAttribute("style", "background-color:#00FF00;");

// 建立表體
var tbody = document.CreateElement("tbody");
table.AppendChild(tbody);

// 建立表格標題行 
var tr = document.CreateElement("tr");
tbody.AppendChild(tr);

// 使用所選元素的屬性設定樣式屬性               
tr.SetAttribute("style", "border: 2px Black solid; background-color:Red; color:#FFFFFF");

// 建立表頭單元格 1
var th = document.CreateElement("th");
var title = document.CreateTextNode("Name");
th.AppendChild(title);
tr.AppendChild(th);

// 建立表頭單元格 2
th = document.CreateElement("th");
title = document.CreateTextNode("Email");
th.AppendChild(title);
tr.AppendChild(th);

// 建立表頭單元格 3
th = document.CreateElement("th");
title = document.CreateTextNode("Phone");
th.AppendChild(title);
tr.AppendChild(th);

// 建立表格資料行 
var dataTr = document.CreateElement("tr");
tbody.AppendChild(dataTr);

// 建立表格資料儲存格1
var td = document.CreateElement("td");
var data = document.CreateTextNode("John Doe");
td.AppendChild(data);
dataTr.AppendChild(td);

// 建立表格資料儲存格2
td = document.CreateElement("td");
data = document.CreateTextNode("john.doe@example.com");
td.AppendChild(data);
dataTr.AppendChild(td);

// 建立表格資料儲存格 3
td = document.CreateElement("td");
data = document.CreateTextNode("123-456-789");
td.AppendChild(data);
dataTr.AppendChild(td);

// 將表格附加到正文
body.AppendChild(table);

// 將文件儲存到文件
document.Save(savePath);
在 C# 中建立 HTML 表格

在 C# 中建立 HTML 表格

在 C# 中使用 Rowspan 和 Colspan 建立 HTML 表

同樣，我們也可以設定<colspan> 和 <rowspan> 使用 SetAttribute(string name, string value) 方法為表格儲存格設定屬性，如下所示：

// 準備編輯文件儲存路徑 
string savePath = "C:\\Files\\ColSpanRowSpan.html";

// 初始化一個空的 HTML 文檔
using var document = new HTMLDocument();

// 建立樣式元素並為表格元素指派顏色 border-style 和 border-color 值
var style = document.CreateElement("style");
style.TextContent = "table, th, td { border: 1px solid #0000ff; border-collapse: collapse;}";

// 找到文檔頭元素並將樣式元素附加到頭部
var head = document.GetElementsByTagName("head").First();
head.AppendChild(style);

// 宣告一個引用的變數體<body>元素
var body = document.Body;

// 建立表格元素
var table = document.CreateElement("table");

// 建立表體
var tbody = document.CreateElement("tbody");
table.AppendChild(tbody);

// 建立表格標題行 
var tr = document.CreateElement("tr");
tbody.AppendChild(tr);

// 建立表頭單元格 1
var th = document.CreateElement("th");
var title = document.CreateTextNode("Person Details");
th.AppendChild(title);
tr.AppendChild(th);

// 指定列跨度
th.SetAttribute("colspan", "2");

// 建立表格資料行 
var dataTr = document.CreateElement("tr");
tbody.AppendChild(dataTr);

// 建立表頭單元格 1
th = document.CreateElement("th");
title = document.CreateTextNode("Name");
th.AppendChild(title);
dataTr.AppendChild(th);

// 建立表格資料儲存格2
var td = document.CreateElement("td");
var data = document.CreateTextNode("John Doe");
td.AppendChild(data);
dataTr.AppendChild(td);

// 建立表格資料行 
dataTr = document.CreateElement("tr");
tbody.AppendChild(dataTr);

// 建立表格標題儲存格
th = document.CreateElement("th");
title = document.CreateTextNode("Phone");
th.AppendChild(title);
dataTr.AppendChild(th);

// 指定列跨度
th.SetAttribute("rowspan", "2");

// 建立表格資料儲存格
td = document.CreateElement("td");
data = document.CreateTextNode("123-456-780");
td.AppendChild(data);
dataTr.AppendChild(td);

// 建立表格資料行 
dataTr = document.CreateElement("tr");
tbody.AppendChild(dataTr);

// 建立表格資料儲存格
td = document.CreateElement("td");
data = document.CreateTextNode("123-456-789");
td.AppendChild(data);
dataTr.AppendChild(td);

// 將表格附加到正文
body.AppendChild(table);

// 將文件儲存到文件
document.Save(savePath);
在 C# 中使用 Rowspan 和 Colspan 建立 HTML 表

在 C# 中使用 Rowspan 和 Colspan 建立 HTML 表

取得免費許可證

您可以獲得免費的臨時許可證來嘗試 Aspose.HTML for .NET，而不受評估限制。

線上 HTML 表格產生器

您可以使用這個免費的在線 HTML 表格生成器 網路應用程序，它是使用此 API 開發的。

建立 HTML 表 – 學習資源

您可以了解有關使用表格創建 HTML 文件的更多信息，並使用以下資源探索該庫的各種其他功能：

結論

在這篇文章中，我們學習如何在 C# 中建立 HTML 表格。我們已經介紹了使用 Aspose.HTML for .NET 以程式設計方式建立表格的基礎知識。透過遵循本文中提供的步驟和程式碼範例，您可以輕鬆開發自己的自訂解決方案來使用 HTML 表格。如有任何疑問，請隨時透過我們的免費支援論壇與我們聯繫。

也可以看看