I want to add a link to every image in the HTML with the value of the "href" attribute be the "src" attribute of the image. Namely changing the
"<p> <img src="test.jpg"/></p>"
to
<p><a href="test.jpg"><img src="jpg"/></a></p>
And my code coming:
using HtmlAgilityPack;
var imgs = document.DocumentNode.Descendants("img");
foreach (HtmlNode node in imgs)
{
if (node.ParentNode.Name != "a")
{
string replaceStr = string.Format("<a href=\"{0}\">{1}</a>", node.GetAttributeValue("src", null), node.OuterHtml);
//node.OuterHtml= replaceStr; It doesn't work, the outerHtml is readonly
//node.ParentNode.RemoveChild(node, true);
}
}
So how should I modify my code to make it work?
Updated: after updating my code:
var imgs = document.DocumentNode.Descendants("img");
foreach (var node in imgs)
{
if (node.ParentNode.Name != "a")
{
var a = document.CreateElement("a");
a.SetAttributeValue("href", node.GetAttributeValue("src", null));
a.ChildNodes.Add(node);
node.ParentNode.ReplaceChild(a, node);
}
}
An error shows up "Unhandled InvalidOperationException ".
First, you could use xpath to select <img>
nodes whose parent node is not <a>
:
var imgs = doc.DocumentNode.SelectNodes("//img[not(parent::a)]").ToList();
Then you should iterate over these nodes. On each iteration step just create a new '' element, appent iteration '' to it, and then replace this '' with newly created <a>
:
foreach (var img in imgs)
{
var a = doc.CreateElement("a");
a.SetAttributeValue("href", img.GetAttributeValue("src", null));
a.ChildNodes.Add(img);
img.ParentNode.ReplaceChild(a, img);
}
Try :
string replaceStr = string.Format("<a href=\"{0}\">{1}</a>", node.GetAttributeValue("src", null), node.OuterHtml);
var newNode = HtmlNode.CreateNode(replaceStr);
node.ParentNode.ReplaceChild(newNode.ParentNode, node);
and change
foreach (var node in imgs)
by
foreach (var node in imgs.ToList())