Как найти все URL-адреса в строке, кроме URL-адреса внутри тега изображения Javascript

Question

Я получаю строку текстового редактора в ответ.

Мне нужно найти все URL-адреса в этой строке и показать URL-адреса внутри Span , за исключением URL-адреса тега img .

Я попробовал следующее

ResetURLs: function (input) {
    var urlRegex = /(?:(?:https?|ftp|file):\/\/|www\.|ftp\.)(?:\([-A-Z0-9+&@#\/%=~_|$?!:,.]*\)|[-A-Z0-9+&@#\/%=~_|$?!:,.])*(?:\([-A-Z0-9+&@#\/%=~_|$?!:,.]*\)|[A-Z0-9+&@#\/%=~_|$])/igm;
    return input.replace(urlRegex, function (url) {
        return '<span style="color:#0000EE" title=' + url + '>' + url + '</span>';
    })
}

Это работает, но также изменяет URL-адреса внутри тега img . Может ли кто-нибудь помочь мне изменить это регулярное выражение, чтобы пропустить все URL-адреса внутри тегов img ?

Спасибо.

Answer 1

Вы можете использовать лучший трюк за все время :

ResetURLs: function (input) {
    var urlRegex = /(<img\s[^>]*>)|(?:(?:https?|ftp|file):\/\/|www\.|ftp\.)(?:\([-A-Z0-9+&@#\/%=~_|$?!:,.]*\)|[-A-Z0-9+&@#\/%=~_|$?!:,.])*(?:\([-A-Z0-9+&@#\/%=~_|$?!:,.]*\)|[A-Z0-9+&@#\/%=~_|$])/gi;
    return input.replace(urlRegex, function (url, img) { return img ? url : '<span style="color:#0000EE" title=' + url + '>' + url + '</span>'; })
}

Подробности

• (<img\s[^>]*>)| добавляется к шаблонув качестве группы захвата с идентификатором 1
• m флаг является избыточным, удален из регулярного выражения
• Второй аргумент replace - это анонимная функция, которая принимает url (полное соответствие) и img (значение в группе 1) аргументы
• Если присутствует img, если оно совпадает, возвращается значение img, иначе возвращается span с url.