تعد جداول HTML طريقة متعددة الاستخدامات وقوية لعرض البيانات على صفحات الويب. ويمكن استخدامها لإنشاء جداول بسيطة، مثل التقويم، أو جداول أكثر تعقيدًا، مثل شبكة البيانات. في هذه التدوينة، سوف نتعلم كيفية إنشاء جدول HTML في لغة C#، خطوة بخطوة. سيزودك هذا الدليل بالمعرفة والمهارات التي تحتاجها لإنشاء جداول HTML بشكل فعال في لغة #C.
تتناول هذه المقالة المواضيع التالية:
- واجهة برمجة تطبيقات #C لإنشاء جداول HTML
- إنشاء جدول HTML في #C
- إنشاء جدول HTML بسمة النمط في #C
- جدول HTML مع الصفوف وcolspan في #C
- مولد جدول HTML عبر الإنترنت
- مصادر التعلم المجانية
C# API لإنشاء جدول HTML
سوف نستخدم Aspose.HTML for .NET لإنشاء جداول HTML في لغة #C. يسمح للمطورين بالتعامل مع مستندات HTML والعمل معها برمجياً. فهو يوفر نطاقًا واسعًا من الميزات والإمكانيات لتحليل مستندات HTML وتحويلها وتحريرها وعرضها داخل تطبيقات .NET.
يرجى إما تنزيل ملف DLL الخاص بواجهة برمجة التطبيقات أو تثبيته باستخدام NuGet.
PM> Install-Package Aspose.Html
إنشاء جدول HTML في #C
يمكننا إنشاء جدول HTML باتباع الخطوات التالية:
- إنشاء مثيل لفئة HTMLDocument.
- اختياريًا، قم بإنشاء عنصر نمط وألحقه بعنصر الرأس.
- إنشاء
<table style=";text-align:right;direction:rtl">
،<tbody>
،<tr>
،<th>
، و<td>
العناصر باستخدام طريقة CreateElement(). - إلحاق العناصر التابعة بالعناصر الأصلية الخاصة بها باستخدام طريقة AppendChild().
- بعد ذلك، قم بإلحاق
<table style=";text-align:right;direction:rtl">
عنصر إلى ` “عنصر. - أخيرًا، قم باستدعاء الأسلوب Save() لحفظ المستند في مسار الملف المحدد.
يوضح نموذج التعليمات البرمجية التالي كيفية إنشاء جدول HTML في #C.
// قم بإعداد مسار لحفظ الملف المحرر
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 باستخدام سمة النمط في #C
يمكننا إنشاء جدول 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 بسمات النمط في #C.
// قم بإعداد مسار لحفظ الملف المحرر
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 في #C
وبالمثل، يمكننا أيضًا تعيين <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);
// حدد كولسبان
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);
احصل على ترخيص مجاني
يمكنك الحصول على ترخيص مؤقت مجاني لتجربة Aspose.HTML لـ .NET دون قيود التقييم.
مولد جدول HTML على الإنترنت
يمكنك استخدام تطبيق الويب مولد جدول HTML المجاني عبر الإنترنت، والذي تم تطويره باستخدام واجهة برمجة التطبيقات هذه.
إنشاء جدول HTML – مصادر التعلم
يمكنك معرفة المزيد حول إنشاء مستندات HTML باستخدام الجداول واستكشاف العديد من الميزات الأخرى للمكتبة باستخدام الموارد أدناه:
- دليل المطور
- تطبيقات مجانية على الانترنت
- مرجع واجهة برمجة التطبيقات
- أدلة ومقالات إرشادية
- منتدى الدعم المجاني
خاتمة
تعلمنا في هذه التدوينة كيفية إنشاء جداول HTML في لغة #C. لقد قمنا بتغطية أساسيات إنشاء الجداول برمجيًا باستخدام Aspose.HTML لـ .NET. باتباع الخطوات ونماذج التعليمات البرمجية المتوفرة في هذه المقالة، يمكنك بسهولة تطوير الحلول المخصصة الخاصة بك للتعامل مع جداول HTML. في حالة وجود أي غموض، فلا تتردد في الاتصال بنا على منتدى الدعم المجاني الخاص بنا.