从整个HTML动态添加类到img标签

本文关键字:img 标签 添加 动态 HTML | 更新日期: 2023-09-27 18:08:47

我有一个丰富的编辑器,添加文本和图像,使图像响应

class="img-thumbnail"

在所有的图像标签中都是需要的,所以我使用了htmllagility pack来从整个Html中提取图像标签,但是如何在每个图像标签上添加类。

例子

从html中提取图像标签后的输入

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

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

代码
 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.
        }
      }

从整个HTML动态添加类到img标签

我猜问题在于您需要在显示HTML之前保存它。否则,HTML敏捷包有时会忽略更改的属性。

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();
    }
 }

你可以像这样给css中的所有图像标签添加属性

.img-thumbnail
{
  // your class property
}
img {
.img-thumbnail
}

这是一个类似的问题。

我想将现有的CSS样式应用于页面上的所有标签。如何?