Selettori CSS in HTML C#

Puoi applicare regole diverse alle regole CSS utilizzando i selettori CSS. Questo articolo illustra i dettagli insieme agli esempi dei metodi QuerySelector e QuerySelectorAll. Puoi utilizzare questi selettori CSS per navigare nei documenti HTML o per creare un modello di ricerca per abbinare gli elementi in un documento HTML.

Usare i selettori CSS nell’installazione dell’API HTML - C#

L’API Aspose.HTML for .NET può essere utilizzata per creare, modificare, manipolare o convertire documenti HTML insieme a molti altri formati di file. Puoi configurarlo facilmente scaricando il file DLL di riferimento dalla sezione Download o eseguendo il seguente comando di installazione NuGet:

PM> Install-Package Aspose.Html

Utilizza il selettore CSS QuerySelector in C#

Puoi dare uno stile a un elemento selezionato o navigare nel file HTML con il metodo QuerySelector. I seguenti passaggi spiegano come dare uno stile a un elemento selezionato che corrisponde al selettore:

  1. Crea un’istanza della classe HTMLDocument.
  2. Crea un selettore CSS per estrarre il primo elemento del paragrafo.
  3. Imposta l’attributo style e salva il file HTML aggiornato.

Lo snippet di codice seguente mostra come utilizzare i selettori CSS QuerySelector per elaborare un elemento selezionato nel documento HTML:

// Preparare il percorso del file HTML di origine
string documentPath = "queryselector.html";

// Crea un'istanza di un documento HTML
var document = new Aspose.Html.HTMLDocument(documentPath);

// Qui creiamo un selettore CSS che estrae il primo elemento del paragrafo nel documento
var element = document.QuerySelector("p");

// Stampa il contenuto del primo paragrafo  
Console.WriteLine(element.InnerHTML);
// output: il metodo QuerySelector() restituisce il primo elemento nel documento che corrisponde al selettore specificato.

// Imposta l'attributo di stile con le proprietà per l'elemento selezionato               
element.SetAttribute("style", "color:rgb(50,150,200); background-color:#e1f0fe;");

// Salvare il documento HTML in un file
document.Save("queryselector-p.html");

Lavora con il selettore CSS QuerySelectorAll in HTML utilizzando C#

A volte potrebbe essere necessario elaborare tutte le occorrenze di un elemento. Segui i passaggi seguenti per lavorare con il selettore CSS QuerySelectorAll:

  1. Caricare il file HTML di input con la classe HTMLDocument.
  2. Crea un selettore CSS per estrarre tutti gli elementi di una classe.
  3. Scorri gli elementi e imposta gli attributi di stile.
  4. Salva il documento HTML aggiornato.

Nell’esempio di codice seguente viene illustrato come utilizzare il selettore CSS QuerySelectorAll a livello di codice in C#:

// Preparare il percorso di output per il salvataggio del documento HTML
string savePath = "css-selector-color.html";

// Preparare il percorso del file HTML di origine
string documentPath = "spring.html";

// Crea un'istanza di un documento HTML
var document = new Aspose.Html.HTMLDocument(documentPath);

// Qui creiamo un selettore CSS che estrae tutti gli elementi il cui attributo 'class' è uguale a 'square2'
var elements = document.QuerySelectorAll(".square2");

// Iterare sull'elenco di elementi risultante
foreach (Aspose.Html.HTMLElement element in elements)
{
    // Imposta l'attributo di stile con la nuova proprietà background-color
    element.Style.BackgroundColor = "#b0d7fb";
}

// Salvare il documento HTML in un file
document.Save(savePath);

Esplora Aspose.HTML for .NET

Puoi visitare lo spazio documentazione per esplorare diversi capitoli che affrontano diverse funzionalità dell’API.

Ottieni la licenza gratuita

Puoi valutare l’API al massimo delle sue capacità richiedendo una licenza temporanea gratuita.

Conclusione

In questo articolo hai imparato come utilizzare i selettori CSS considerando gli esempi dei selettori QuerySelector e QuerySelectorAll. In caso di domande, non esitate a scriverci al forum.

Guarda anche

Unisci file EPUB in C#