Question

I am trying to extract href and src links from an HTML string. According to this post, I was able to get the image portion. Can anyone help adjust the regular expression to include the href URL in the collection too?

public List<string> GetLinksFromHtml(string content)
{
    string regex = @"<img[^>]*?src\s*=\s*[""']?([^'"" >]+?)[ '""][^>]*?>";
    var matches = Regex.Matches(content, regex, RegexOptions.IgnoreCase | RegexOptions.Singleline);
    var links = new List<string>();

    foreach (Match item in matches)
    {
        string link = item.Groups[1].Value;
        links.Add(link);
    }

    return links;
}

Answer 1

Okie Doke! Without “an extra library”, and “quick and light”, here ya go:

<(?<Tag_Name>(a)|img)\b[^>]*?\b(?<URL_Type>(?(1)href|src))\s*=\s*(?:"(?<URL>(?:\\"|[^"])*)"|'(?<URL>(?:\\'|[^'])*)')

or as a C# string:

@"<(?<Tag_Name>(a)|img)\b[^>]*?\b(?<URL_Type>(?(1)href|src))\s*=\s*(?:""(?<URL>(?:\\""|[^""])*)""|'(?<URL>(?:\\'|[^'])*)')"

This captures the tag name (a or img) into the group “Tag_Name”, the URL type (href or src) into the group “URL_Type”, and the URL into the group “URL” (I know, I got a bit creative with the group names).

It handles either type of quotes (" or '), and even though any type of quotes in a URL should already be encoded into entities, it will ignore any single-escaped quote characters \' and \".

It does not ignore unclosed tags (therefore malformed HTML), it will find an opening for one of the tags such as <a or img, then proceed to ignore everything except a greater than (>) up until it finds the matching URL type of attribute (href for a tags and src for img tags), then match the contents. It then quits and does not worry about the rest of the tag!

Let me know if you’d like me to break it down for you, but here is a sampling of the matches it made for this very page:

<Match>                                  'Tag' 'URL_Type' 'URL'
---------------------------------------- ----- ---------- -----------------------------
<a href="http://meta.stackoverflow.com"   a     href      http://meta.stackoverflow.com
<a href="/about"                          a     href      /about
<a href="/faq"                            a     href      /faq
<a href="/"                               a     href      /
<a id="nav-questions" href="/questions"   a     href      /questions
...
<img src="/posts/8066248/ivc/d499"        img   src       /posts/8066248/ivc/d499

It found a total of 140 tags (I am assuming additional posters will increase this somewhat)