修改保存在 DB 表中的 HTML 内容

Question

我在 DB 中有一个包含 HTML 格式文本的通用文本字段的表。我需要解析这样一个字段的内容，找到所有的“img”标签并执行2个操作（仅适用于“img”标签）：

1) 删除“style”属性及其所有值。
2) 插入一个 class="img-responsive" 属性。

要解析的 HTML 内容的一个特征是它没有完整的层次结构。例如，要解析的字符串可以如下：

<div>
<p>This is some text</p>
<img src="http://www.mywebsite.com/myImage.jpg" alt = "" style="width:600px; height: 400px;"/>
</div>

我尝试了不同的方法来查找“img”标签，但均未成功。例如：

String strHTML = "The sample HTML code above";
var doc = new HtmlAgilityPack.HtmlDocument();
doc.LoadHtml(strHTML);
foreach (var img in doc.DocumentNode.Descendants("img"))
{
    // Remove "style" attribute for "img" tag.
    // Add class="img-responsive" for "img" tag.
}

上面代码的问题是没有根节点但是我不知道如何“覆盖”这样的节点并直接解析字符串。

Answer 1

我不会用 C# 编写代码，但我确信这可以使用正则表达式成功完成并替换为新的编辑值。

Answer 2

这是我使用敏捷包 HTML 找到的方式。

using System;
using HtmlAgilityPack;

public class Program
{
    public static void Main()
    {
        var html = @"<div>
                         <p>This is some text</p>
                         <img src=""http://www.mywebsite.com/myImage1.jpg"" alt = """" style=""width:600px; height: 400px;""/>
                         <img src=""http://www.mywebsite.com/myImage2.jpg"" alt = """" style=""width:600px; height: 400px;""/>
                         <img src=""http://www.mywebsite.com/myImage3.jpg"" alt = """" style=""width:600px; height: 400px;""/>
                    </div>";

        var htmlDoc = new HtmlDocument();
        htmlDoc.LoadHtml(html);

        var htmlNodes = htmlDoc.DocumentNode.SelectNodes("//img");

        foreach (var node in htmlNodes){

            // Adding class "img-responsive"
            node.AddClass("img-responsive");

            // Removing style attribute
            node.Attributes["style"].Remove();

            Console.WriteLine(node.OuterHtml);
        }

        // Adding the close </img> to each image of the HTML
        HtmlNode.ElementsFlags["img"] = HtmlElementFlag.Closed;

        // Here you can see the changes in the HTML string
        Console.WriteLine(htmlDoc.DocumentNode.OuterHtml);
    }
}

您可以在此处参考 Agility Pack HTML 文档：https://html-agility-pack.net/documentation

这是查看在 dotnetfiddle 中运行的解决方案的链接：https://dotnetfiddle.net/uyhAKE

我希望这对你有用。