جداول HTML روشی همه کاره و قدرتمند برای نمایش داده ها در صفحات وب هستند. می توان از آنها برای ایجاد جداول ساده مانند تقویم یا جداول پیچیده تر مانند شبکه داده استفاده کرد. در این پست وبلاگ نحوه ایجاد جدول HTML در سی شارپ را به صورت گام به گام یاد خواهیم گرفت. این راهنما دانش و مهارت های لازم برای ایجاد موثر جداول HTML در سی شارپ را در اختیار شما قرار می دهد.
این مقاله موضوعات زیر را پوشش می دهد:
- C# API برای ایجاد جداول HTML
- یک جدول HTML در سی شارپ ایجاد کنید
- یک جدول HTML با ویژگی style در سی شارپ ایجاد کنید
- جدول HTML با rowspan و colspan در C#
- سازنده آنلاین جدول HTML
- منابع آموزشی رایگان
C# API برای ایجاد جدول HTML
ما از Aspose.HTML for .NET برای ایجاد جداول HTML در سی شارپ استفاده خواهیم کرد. این به توسعه دهندگان اجازه می دهد تا اسناد HTML را به صورت برنامه نویسی دستکاری و کار کنند. طیف گسترده ای از ویژگی ها و قابلیت ها را برای تجزیه، تبدیل، ویرایش و رندر اسناد HTML در برنامه های NET ارائه می دهد.
لطفاً یا DLL API را دانلود کنید یا آن را با استفاده از NuGet نصب کنید.
PM> Install-Package Aspose.Html
ایجاد جدول HTML در سی شارپ
با دنبال کردن مراحل زیر می توانیم یک جدول HTML ایجاد کنیم:
- یک نمونه از کلاس HTMLDocument ایجاد کنید.
- در صورت تمایل، یک عنصر سبک ایجاد کنید و آن را به عنصر head اضافه کنید.
- ایجاد
<table>
,<tbody>
,<tr>
,<th>
,و<td>
عناصر با استفاده از متد ()CreateElement. - با استفاده از متد AppendChild() عناصر فرزند را به عناصر والد خود اضافه کنید.
- پس از آن،
<table>
عنصر به<body>
عنصر - در نهایت متد Save() را فراخوانی کنید تا سند در مسیر فایل داده شده ذخیره شود.
نمونه کد زیر نحوه ایجاد جدول HTML در سی شارپ را نشان می دهد.
// مسیری را برای ذخیره فایل ویرایش شده آماده کنید
string savePath = "C:\\Files\\Table.html";
// یک سند HTML خالی را راه اندازی کنید
var document = new HTMLDocument();
// یک عنصر سبک ایجاد کنید و مقادیر رنگ حاشیه و رنگ حاشیه را برای عنصر جدول اختصاص دهید
var style = document.CreateElement("style");
style.TextContent = "table, th, td { border: 1px solid #0000ff; }";
// عنصر سر سند را پیدا کنید و عنصر سبک را به سر اضافه کنید
var head = document.GetElementsByTagName("head").First();
head.AppendChild(style);
// بدن متغیری را که به<body style=";text-align:right;direction:rtl"> عنصر
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);
ایجاد جدول HTML با ویژگی Style در سی شارپ
با دنبال کردن مراحلی که قبلا ذکر شد میتوانیم یک جدول 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.
نمونه کد زیر نحوه ایجاد یک جدول HTML با ویژگی های سبک در سی شارپ را نشان می دهد.
// مسیری را برای ذخیره فایل ویرایش شده آماده کنید
string savePath = "C:\\Files\\TableWithStyle.html";
// یک سند HTML خالی را راه اندازی کنید
using var document = new HTMLDocument();
// یک عنصر سبک ایجاد کنید و مقادیر رنگ حاشیه و رنگ حاشیه را برای عنصر جدول اختصاص دهید
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 style=";text-align:right;direction:rtl"> عنصر
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);
ایجاد جدول HTML با Rowspan و Colspan در سی شارپ
به طور مشابه، ما همچنین می توانیم را تنظیم کنیم <colspan>
و<rowspan>
ویژگی های سلول های جدول با استفاده از روش SetAttribute (نام رشته، مقدار رشته)، همانطور که در زیر نشان داده شده است:
// مسیری را برای ذخیره فایل ویرایش شده آماده کنید
string savePath = "C:\\Files\\ColSpanRowSpan.html";
// یک سند HTML خالی را راه اندازی کنید
using var document = new HTMLDocument();
// یک عنصر سبک ایجاد کنید و مقادیر رنگ حاشیه و رنگ حاشیه را برای عنصر جدول اختصاص دهید
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 style=";text-align:right;direction:rtl"> عنصر
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);
// Colspan را مشخص کنید
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);
// Colspan را مشخص کنید
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);
مجوز رایگان دریافت کنید
میتوانید یک مجوز موقت رایگان دریافت کنید تا Aspose.HTML را برای داتنت بدون محدودیت ارزیابی امتحان کنید.
تولید کننده جدول HTML آنلاین
میتوانید از این برنامه وب آنلاین رایگان HTML table generator استفاده کنید که با استفاده از این API توسعه یافته است.
ایجاد جدول HTML – منابع یادگیری
می توانید با استفاده از منابع زیر درباره ایجاد اسناد HTML با جداول بیشتر بیاموزید و سایر ویژگی های کتابخانه را بررسی کنید:
- راهنمای توسعه دهنده
- برنامه های آنلاین رایگان
- مرجع API
- راهنماها و مقالات چگونه
- تالار گفتمان پشتیبانی رایگان
نتیجه
در این پست وبلاگ نحوه ایجاد جداول HTML در سی شارپ را یاد گرفتیم. ما اصول ایجاد جداول به صورت برنامه نویسی با استفاده از Aspose.HTML را برای دات نت پوشش داده ایم. با دنبال کردن مراحل و نمونه کد ارائه شده در این مقاله، می توانید به راحتی راه حل های سفارشی خود را برای کار با جداول HTML توسعه دهید. در صورت وجود هرگونه ابهامی، لطفاً در انجمن پشتیبانی رایگان ما با ما تماس بگیرید.