Crea tabella HTML in C#

Le tabelle HTML sono un modo versatile e potente per visualizzare i dati sulle pagine web. Possono essere utilizzati per creare tabelle semplici, come un calendario, o tabelle più complesse, come una griglia di dati. In questo post del blog impareremo come creare una tabella HTML in C#, passo dopo passo. Questa guida ti fornirà le conoscenze e le competenze necessarie per creare in modo efficace tabelle HTML in C#.

Questo articolo tratta i seguenti argomenti:

  1. API C# per creare tabelle HTML
  2. Crea una tabella HTML in C#
  3. Crea una tabella HTML con l’attributo style in C#
  4. Tabella HTML con rowspan e colspan in C#
  5. Generatore di tabelle HTML online
  6. Risorse didattiche gratuite

API C# per creare tabelle HTML

Utilizzeremo Aspose.HTML for .NET per creare tabelle HTML in C#. Consente agli sviluppatori di manipolare e lavorare con i documenti HTML a livello di codice. Fornisce un’ampia gamma di funzionalità e funzionalità per l’analisi, la conversione, la modifica e il rendering di documenti HTML all’interno delle applicazioni .NET.

Scarica la DLL dell’API o installala utilizzando NuGet.

PM> Install-Package Aspose.Html

Crea tabella HTML in C#

Possiamo creare una tabella HTML seguendo i passaggi seguenti:

  1. Crea un’istanza della classe HTMLDocument.
  2. Facoltativamente, crea un elemento di stile e aggiungilo all’elemento head.
  3. Crea <table>, <tbody>, <tr>, <th>, e <td> elementi utilizzando il metodo CreateElement().
  4. Aggiungi elementi figlio ai rispettivi elementi genitore utilizzando il metodo AppendChild().
  5. Successivamente, aggiungi il <table> elemento al <body> elemento.
  6. Infine, chiama il metodo Save() per salvare il documento nel percorso file indicato.

L’esempio di codice seguente mostra come creare una tabella HTML in C#.

// Preparare un percorso per il salvataggio del file modificato 
string savePath = "C:\\Files\\Table.html";

// Inizializza un documento HTML vuoto
var document = new HTMLDocument();

// Crea un elemento di stile e assegna i valori color border-style e border-color per l'elemento tabella
var style = document.CreateElement("style");
style.TextContent = "table, th, td { border: 1px solid #0000ff; }";

// Trova l'elemento head del documento e aggiungi l'elemento style alla testa
var head = document.GetElementsByTagName("head").First();
head.AppendChild(style);

// Dichiarare un corpo variabile che fa riferimento a<body> elemento
var body = document.Body;

// Specificare colonne e righe
var cols = 3;
var rows = 2;
var isFirstRowHeader = false;

// Crea elemento tabella
var table = document.CreateElement("table");

// Crea un corpo della tabella
var tbody = document.CreateElement("tbody");
table.AppendChild(tbody);

// Crea una riga di intestazione della tabella 
if (isFirstRowHeader)
{
    var tr = document.CreateElement("tr");
    tbody.AppendChild(tr);

    // Crea colonne di intestazione della tabella 
   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++)
    {
        // Crea una riga della tabella 
        var dataTr = document.CreateElement("tr");
        tbody.AppendChild(dataTr);

        // Crea celle di intestazione della tabella
       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++)
    {
        // Crea una riga della tabella 
        var dataTr = document.CreateElement("tr");
        tbody.AppendChild(dataTr);

        // Crea celle di tabella
       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);
        }
    }
}

// Aggiungi la tabella al corpo
body.AppendChild(table);

// Salvare il documento in un file
document.Save(savePath);
Crea tabella HTML in C#

Crea tabella HTML in C#

Crea tabella HTML con attributo di stile in C#

Possiamo creare una tabella HTML seguendo i passaggi menzionati in precedenza. Tuttavia, dobbiamo impostare il file <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.

Nell’esempio di codice seguente viene illustrato come creare una tabella HTML con attributi di stile in C#.

// Preparare un percorso per il salvataggio del file modificato 
string savePath = "C:\\Files\\TableWithStyle.html";

// Inizializza un documento HTML vuoto
using var document = new HTMLDocument();

// Crea un elemento di stile e assegna i valori color border-style e border-color per l'elemento tabella
var style = document.CreateElement("style");
style.TextContent = "table, th, td { border: 1px solid #0000ff; border-collapse: collapse;}";

// Trova l'elemento head del documento e aggiungi l'elemento style alla testa
var head = document.GetElementsByTagName("head").First();
head.AppendChild(style);

// Dichiarare un corpo variabile che fa riferimento a<body> elemento
var body = document.Body;

// Crea elemento tabella
var table = document.CreateElement("table");
table.SetAttribute("style", "background-color:#00FF00;");

// Crea il corpo della tabella
var tbody = document.CreateElement("tbody");
table.AppendChild(tbody);

// Crea una riga di intestazione della tabella 
var tr = document.CreateElement("tr");
tbody.AppendChild(tr);

// Imposta l'attributo di stile con le proprietà per l'elemento selezionato               
tr.SetAttribute("style", "border: 2px Black solid; background-color:Red; color:#FFFFFF");

// Crea la cella di intestazione della tabella 1
var th = document.CreateElement("th");
var title = document.CreateTextNode("Name");
th.AppendChild(title);
tr.AppendChild(th);

// Crea la cella di intestazione della tabella 2
th = document.CreateElement("th");
title = document.CreateTextNode("Email");
th.AppendChild(title);
tr.AppendChild(th);

// Crea la cella di intestazione della tabella 3
th = document.CreateElement("th");
title = document.CreateTextNode("Phone");
th.AppendChild(title);
tr.AppendChild(th);

// Crea una riga di dati della tabella 
var dataTr = document.CreateElement("tr");
tbody.AppendChild(dataTr);

// Crea la cella dati della tabella 1
var td = document.CreateElement("td");
var data = document.CreateTextNode("John Doe");
td.AppendChild(data);
dataTr.AppendChild(td);

// Crea cella dati tabella 2
td = document.CreateElement("td");
data = document.CreateTextNode("john.doe@example.com");
td.AppendChild(data);
dataTr.AppendChild(td);

// Crea cella dati tabella 3
td = document.CreateElement("td");
data = document.CreateTextNode("123-456-789");
td.AppendChild(data);
dataTr.AppendChild(td);

// Aggiungi la tabella al corpo
body.AppendChild(table);

// Salvare il documento in un file
document.Save(savePath);
Crea tabella HTML in C#

Crea tabella HTML in C#

Crea una tabella HTML con Rowspan e Colspan in C#

Allo stesso modo, possiamo anche impostare <colspan> e <rowspan> attributi per le celle della tabella utilizzando il metodo SetAttribute(nome stringa, valore stringa), come mostrato di seguito:

// Preparare un percorso per il salvataggio del file modificato 
string savePath = "C:\\Files\\ColSpanRowSpan.html";

// Inizializza un documento HTML vuoto
using var document = new HTMLDocument();

// Crea un elemento di stile e assegna i valori color border-style e border-color per l'elemento tabella
var style = document.CreateElement("style");
style.TextContent = "table, th, td { border: 1px solid #0000ff; border-collapse: collapse;}";

// Trova l'elemento head del documento e aggiungi l'elemento style alla testa
var head = document.GetElementsByTagName("head").First();
head.AppendChild(style);

// Dichiarare un corpo variabile che fa riferimento a<body> elemento
var body = document.Body;

// Crea elemento tabella
var table = document.CreateElement("table");

// Crea il corpo della tabella
var tbody = document.CreateElement("tbody");
table.AppendChild(tbody);

// Crea una riga di intestazione della tabella 
var tr = document.CreateElement("tr");
tbody.AppendChild(tr);

// Crea la cella di intestazione della tabella 1
var th = document.CreateElement("th");
var title = document.CreateTextNode("Person Details");
th.AppendChild(title);
tr.AppendChild(th);

// Specificare Colspan
th.SetAttribute("colspan", "2");

// Crea una riga di dati della tabella 
var dataTr = document.CreateElement("tr");
tbody.AppendChild(dataTr);

// Crea la cella di intestazione della tabella 1
th = document.CreateElement("th");
title = document.CreateTextNode("Name");
th.AppendChild(title);
dataTr.AppendChild(th);

// Crea cella dati tabella 2
var td = document.CreateElement("td");
var data = document.CreateTextNode("John Doe");
td.AppendChild(data);
dataTr.AppendChild(td);

// Crea una riga di dati della tabella 
dataTr = document.CreateElement("tr");
tbody.AppendChild(dataTr);

// Crea cella di intestazione della tabella
th = document.CreateElement("th");
title = document.CreateTextNode("Phone");
th.AppendChild(title);
dataTr.AppendChild(th);

// Specificare Colspan
th.SetAttribute("rowspan", "2");

// Crea cella dati tabella
td = document.CreateElement("td");
data = document.CreateTextNode("123-456-780");
td.AppendChild(data);
dataTr.AppendChild(td);

// Crea una riga di dati della tabella 
dataTr = document.CreateElement("tr");
tbody.AppendChild(dataTr);

// Crea cella dati tabella
td = document.CreateElement("td");
data = document.CreateTextNode("123-456-789");
td.AppendChild(data);
dataTr.AppendChild(td);

// Aggiungi la tabella al corpo
body.AppendChild(table);

// Salvare il documento in un file
document.Save(savePath);
Crea una tabella HTML con Rowspan e Colspan in C#

Crea una tabella HTML con Rowspan e Colspan in C#

Ottieni una licenza gratuita

Puoi ottenere una licenza temporanea gratuita per provare Aspose.HTML for .NET senza limitazioni di valutazione.

Generatore di tabelle HTML online

Puoi utilizzare questa app Web generatore di tabelle HTML online gratuita, sviluppata utilizzando questa API.

Crea tabella HTML – Risorse didattiche

Puoi saperne di più sulla creazione di documenti HTML con tabelle ed esplorare varie altre funzionalità della libreria utilizzando le risorse seguenti:

Conclusione

In questo post del blog abbiamo imparato come creare tabelle HTML in C#. Abbiamo trattato le nozioni di base sulla creazione di tabelle a livello di codice utilizzando Aspose.HTML for .NET. Seguendo i passaggi e gli esempi di codice forniti in questo articolo, puoi sviluppare facilmente soluzioni personalizzate per lavorare con le tabelle HTML. In caso di ambiguità, non esitate a contattarci sul nostro forum di supporto gratuito.

Guarda anche