
HTML 表格是在网页上显示数据的一种通用而强大的方法。它们可用于创建简单的表格(如日历)或更复杂的表格(如数据网格)。在本文中,我们将逐步学习如何用 C# 创建 HTML 表格。本文将为您提供在 C# 中有效创建 HTML 表格所需的知识和技能。
本文涵盖以下主题:
1. 创建 HTML 表格的 C# API
2. 用 C# 创建 HTML 表格
3. 用 C# 创建带样式属性的 HTML 表格
4. 用 C# 创建带 rowspan 和 colspan 的 HTML 表格
5. 在线 HTML 表格生成器
创建 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. 使用 CreateElement() 方法创建 <table>、<tbody>、<tr>、<th> 和 <td> 元素。
4. 使用 AppendChild() 方法将子元素追加到父元素。
5. 然后,将 <table> 元素追加到 <body> 元素。
6. 最后,调用 Save() 方法将文档保存在给定的文件路径下。
以下代码示例展示了如何用 C# 创建 HTML 表格。
// Prepare a path for edited file saving
string savePath = "C:\\Files\\Table.html";
// Initialize an empty HTML document
var document = new HTMLDocument();
// Create a style element and assign the color border-style and border-color values for table element
var style = document.CreateElement("style");
style.TextContent = "table, th, td { border: 1px solid #0000ff; }";
// Find the document head element and append style element to the head
var head = document.GetElementsByTagName("head").First();
head.AppendChild(style);
// Declare a variable body that references the <body> element
var body = document.Body;
// Specify cols and rows
var cols = 3;
var rows = 2;
var isFirstRowHeader = false;
// Create table element
var table = document.CreateElement("table");
// Create a table body
var tbody = document.CreateElement("tbody");
table.AppendChild(tbody);
// Create a table header row
if (isFirstRowHeader)
{
var tr = document.CreateElement("tr");
tbody.AppendChild(tr);
// Create table header columns
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++)
{
// Create a table row
var dataTr = document.CreateElement("tr");
tbody.AppendChild(dataTr);
// Create table header cells
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++)
{
// Create a table row
var dataTr = document.CreateElement("tr");
tbody.AppendChild(dataTr);
// Create table cells
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);
}
}
}
// Append table to body
body.AppendChild(table);
// Save the document to a file
document.Save(savePath);

用 C# 创建带样式属性的 HTML 表格
我们可以按照前面提到的步骤创建 HTML 表格。不过,我们需要使用 SetAttribute(string name, string value) 方法为元素设置 <style> 属性。该方法会为元素添加一个新属性,如果属性名称已经存在,则会更新属性值。我们可以为 <table>、<tbody>、<tr>、<th> 和 <td> 元素设置属性。
以下代码示例展示了如何用 C# 创建一个带有样式属性的 HTML 表格。
// Prepare a path for edited file saving
string savePath = "C:\\Files\\TableWithStyle.html";
// Initialize an empty HTML document
using var document = new HTMLDocument();
// Create a style element and assign the color border-style and border-color values for table element
var style = document.CreateElement("style");
style.TextContent = "table, th, td { border: 1px solid #0000ff; border-collapse: collapse;}";
// Find the document head element and append style element to the head
var head = document.GetElementsByTagName("head").First();
head.AppendChild(style);
// Declare a variable body that references the <body> element
var body = document.Body;
// Create table element
var table = document.CreateElement("table");
table.SetAttribute("style", "background-color:#00FF00;");
// Create table body
var tbody = document.CreateElement("tbody");
table.AppendChild(tbody);
// Create table header row
var tr = document.CreateElement("tr");
tbody.AppendChild(tr);
// Set style attribute with properties for the selected element
tr.SetAttribute("style", "border: 2px Black solid; background-color:Red; color:#FFFFFF");
// Create table header cell 1
var th = document.CreateElement("th");
var title = document.CreateTextNode("Name");
th.AppendChild(title);
tr.AppendChild(th);
// Create table header cell 2
th = document.CreateElement("th");
title = document.CreateTextNode("Email");
th.AppendChild(title);
tr.AppendChild(th);
// Create table header cell 3
th = document.CreateElement("th");
title = document.CreateTextNode("Phone");
th.AppendChild(title);
tr.AppendChild(th);
// Create table data row
var dataTr = document.CreateElement("tr");
tbody.AppendChild(dataTr);
// Create table data cell 1
var td = document.CreateElement("td");
var data = document.CreateTextNode("John Doe");
td.AppendChild(data);
dataTr.AppendChild(td);
// Create table data cell 2
td = document.CreateElement("td");
data = document.CreateTextNode("john.doe@example.com");
td.AppendChild(data);
dataTr.AppendChild(td);
// Create table data cell 3
td = document.CreateElement("td");
data = document.CreateTextNode("123-456-789");
td.AppendChild(data);
dataTr.AppendChild(td);
// Append table to body
body.AppendChild(table);
// Save the document to a file
document.Save(savePath);

用 C# 创建带 Rowspan 和 Colspan 的 HTML 表格
同样,我们也可以使用 SetAttribute(string name, string value) 方法为表格单元格设置 <colspan> 和 <rowspan> 属性,如下所示:
// Prepare a path for edited file saving
string savePath = "C:\\Files\\ColSpanRowSpan.html";
// Initialize an empty HTML document
using var document = new HTMLDocument();
// Create a style element and assign the color border-style and border-color values for table element
var style = document.CreateElement("style");
style.TextContent = "table, th, td { border: 1px solid #0000ff; border-collapse: collapse;}";
// Find the document head element and append style element to the head
var head = document.GetElementsByTagName("head").First();
head.AppendChild(style);
// Declare a variable body that references the <body> element
var body = document.Body;
// Create table element
var table = document.CreateElement("table");
// Create table body
var tbody = document.CreateElement("tbody");
table.AppendChild(tbody);
// Create table header row
var tr = document.CreateElement("tr");
tbody.AppendChild(tr);
// Create table header cell 1
var th = document.CreateElement("th");
var title = document.CreateTextNode("Person Details");
th.AppendChild(title);
tr.AppendChild(th);
// Specify Colspan
th.SetAttribute("colspan", "2");
// Create table data row
var dataTr = document.CreateElement("tr");
tbody.AppendChild(dataTr);
// Create table header cell 1
th = document.CreateElement("th");
title = document.CreateTextNode("Name");
th.AppendChild(title);
dataTr.AppendChild(th);
// Create table data cell 2
var td = document.CreateElement("td");
var data = document.CreateTextNode("John Doe");
td.AppendChild(data);
dataTr.AppendChild(td);
// Create table data row
dataTr = document.CreateElement("tr");
tbody.AppendChild(dataTr);
// Create table header cell
th = document.CreateElement("th");
title = document.CreateTextNode("Phone");
th.AppendChild(title);
dataTr.AppendChild(th);
// Specify Colspan
th.SetAttribute("rowspan", "2");
// Create table data cell
td = document.CreateElement("td");
data = document.CreateTextNode("123-456-780");
td.AppendChild(data);
dataTr.AppendChild(td);
// Create table data row
dataTr = document.CreateElement("tr");
tbody.AppendChild(dataTr);
// Create table data cell
td = document.CreateElement("td");
data = document.CreateTextNode("123-456-789");
td.AppendChild(data);
dataTr.AppendChild(td);
// Append table to body
body.AppendChild(table);
// Save the document to a file
document.Save(savePath);

获取免费许可证
您可以免费获得临时许可证,试用 Aspose.HTML for .NET,不受评估限制。
在线 HTML 表格生成器
您可以使用本 API 开发的免费在线 HTML 表格生成器网络应用程序。

结论
在本文中,我们学习了如何用 C# 创建 HTML 表格。我们介绍了使用 Aspose.HTML for .NET 以编程方式创建表格的基础知识。按照本文提供的步骤和代码示例,您可以轻松开发出自己的定制解决方案来处理 HTML 表格。如果有任何不清楚的地方,请随时与我们联系。
渝公网安备50010702505508