Построение регулярного выражения для переноса изображений с <a>

Question

Веб-страница содержит множество элементов изображения:

<img src="myImage.gif" width="180" height="18" />

Но они могут быть не очень хорошо сформированы, например, атрибуты width или height могут отсутствовать. И это также может быть неправильно закрыто с /. Атрибут src всегда там.

Мне нужно регулярное выражение, которое оборачивает их гиперссылкой с href, установленным в src img.

<a href="myImage.gif" target="_blank"><img src="myImage.gif" width="180" height="18" /></a>

Я могу успешно найти изображения с помощью этого регулярного выражения в этом редакторе: http://gskinner.com/RegExr/:

<img src="([^<]*)"[^<]*>

Но каков следующий шаг?

Answer 1

Лучше использовать метод на основе DOM, , но если это регулярное выражение работает (это непросто для общего ввода HTML), чтобы сопоставить желаемые элементы <img> со значением атрибута src захваченный в \1, затем просто замените весь матч (захваченный в \0) на:

<a href="\1" target="_blank">\0</a>

В Java обратные ссылки в замещающей строке будут $0 и $1; Я не уверен, какой язык вы используете, так что настройте соответственно.

Однако в Java что-то вроде этого будет работать:

String imgHrefed = str.replaceAll(
   "<img src=\"([^<]*)\"[^<]*>",
   "<a href=\"$1\" target=\"_blank\">$0</a>"
);

---

Из вашего вопроса не было ясно, что делать с другими атрибутами, которые может иметь <img>. Приведенная выше замена сохраняет их такими, какие они есть. Если вы также хотите переписать их (т. Е. Вы больше не , а просто оборачиваете <img> в <a>), то, возможно, вы захотите переписать это:

<a href="\1" target="_blank"><img src="\1" width="180" height="18" /></a>

Answer 2

В .net регулярное выражение в основном совпадает с javascript в большинстве случаев, но обозначения окружающего кода будут немного отличаться.

    string imageHtmlSnippet = @"<img src=""myImage.gif"" width=""180"" height=""18"" />";
    string imageHtmlReplacement = @"<a href=""$1"" target=""_blank""><img src=""$1"" width=""180"" height=""18"" /></a>";

    Regex findImages = new Regex(@"<img src=""([^<]*)""[^<]*>");

    string fixedHtmlSnippet = findImages.Replace(imageHtmlSnippet, imageHtmlReplacement);

ОДНАКО - это регулярное выражение не будет выполнено, если src непервый атрибут в теге.У меня нет времени, чтобы исправить это, потому что я уже должен быть за дверью:)

По правде говоря, вы должны искать html-библиотеку разбора, такую ​​как HtmlAgilityPack, чтобы проанализировать ее (если вы работаете в .net):

• http://runtingsproper.blogspot.com/search/label/HtmlAgilityPack

Answer 3

В JavaScript используйте string.replace () , где $1 соответствует выбранной вами части:

str.replace(/<img src="([^<]*)"[^<]*>/, 
    '"<a href="$1" target="_blank"><img src="$1" width="180" height="18" /></a>')

Или, что еще лучше, захватить весь тег image (теперь src $2, поскольку он во втором захвате):

s.replace(/(<img src="([^<]*)"[^<]*>)/, '"<a href="$2" target="_blank">$1</a>')