Aggiungi dinamicamente la classe al tag img dall'intero HTML

asp.net c# html-agility-pack

Domanda

Ho un editor ricco che aggiunge testo e immagini, per rendere le immagini reattive

class="img-thumbnail"

è necessario in tutti i tag immagine, quindi ho usato il pacchetto HtmlAgility per estrarre i tag immagine dall'intero Html ma come aggiungere la classe su ogni tag immagine.

Esempio

Inserimento da html dopo l'estrazione del tag immagine

<img src="http://domain.com/images/image1.jpg">

Previsto

<img src="http://domain.com/images/image1.jpg" class="img-thumbnail">

Codice

 public string ParseImage(string pHtml)
    {

        HtmlDocument doc = new HtmlDocument();
        doc.LoadHtml(pHtml);
        var imgs = doc.DocumentNode.SelectNodes("//img");

        foreach (var item in imgs)
        {
            string orig = item.Attributes["src"].Value;
            //Add class to each img tag.
        }
      }

Risposta accettata

Immagino che il problema risieda nel fatto che è necessario salvare l'HTML prima di visualizzarlo. Altrimenti, HTML Agility Pack talvolta omette gli attributi modificati.

public string ParseImage(string pHtml)
{

   HtmlDocument doc = new HtmlDocument();
   doc.LoadHtml(pHtml);
   var imgs = doc.DocumentNode.SelectNodes("//img");

    foreach (var item in imgs)
    {
        //string orig = item.Attributes["src"].Value;
        item.SetAttributeValue("class", "img-thumbnail");
        //Add class to each img tag.
    }
    using(StringWriter tw = new StringWriter ()){
        doc.Save(tw);
        return tw.ToString();
    }
 }

Risposta popolare

Puoi aggiungere attributi a tutti i tag immagine in css come questo

.img-thumbnail
{
  // your class property
}

img {
.img-thumbnail
}

Ecco una domanda simile.

Voglio applicare uno stile CSS esistente a tutte le etichette su una pagina. Come?



Autorizzato sotto: CC-BY-SA with attribution
Non affiliato con Stack Overflow
È legale questo KB? Sì, impara il perché
Autorizzato sotto: CC-BY-SA with attribution
Non affiliato con Stack Overflow
È legale questo KB? Sì, impara il perché