用于匹配 Ruby 中的 img 标签的正则表达式

Question

我有两个字符串：

<p class="pic"><img src="image/pic003.jpg" alt="" class="w21em" /></p>

<p class="footnote">oremIpsum loremIpsum oremIpsum loremIpsum<img src="image/pic027.jpg" alt="" class="w0em2" />oremIpsum loremIpsum<img src="image/pic028.jpg" alt="" class="w0em2" />`

对于第一个应该 return:

[<img src="image/pic003.jpg" alt="" class="w21em" />]

第二个应该是

[<img src="image/pic027.jpg" alt="" class="w0em2" />, [<img src="image/pic028.jpg" alt="" class="w0em2" />

为此，我写了一个像 para.scan(/\<img.*\>?/) 这样的正则表达式，它输出第一个像

["<img src=\"image/pic003.jpg\" alt=\"\" class=\"w21em\" /></p>"]

第二个像

["<img src=\"image/pic027.jpg\" alt=\"\" class=\"w0em2\" />loremIpsum loremIpsum1/<img src=\"image/pic028.jpg\" alt=\"\" class=\"w0em2\" /> </p>"]

如何解决这个问题？

Answer 1

试试这个正则表达式模式：<img[^>]+\/>。

它将匹配任何自动关闭的 img 标签，然后匹配任何不是 > 字符来关闭标签的内容。模式末尾的 \/> 将匹配 SELF 结束标记 <img {anything not >} />

Answer 2

正则表达式

您可以 design/modify/change 您在 regex101.com 中的表达式：

((<img)([A-Za-z0-9"'=_\-.\/\s]+)(\/>))

一种方法是在捕获组中列出所有字符：

([A-Za-z0-9"'=_\-.\/\s]+)

您还可以修改右边界 (\/>) 以防它们可能缺少正斜杠。

正则表达式电路

您可以在 jex.im 中可视化您的表情：

JavaScript演示

const regex = /((<img)([A-Za-z0-9"'=_\-.\/\s]+)(\/>))/gm;
const str = `<p class="pic"><img src="image/pic003.jpg" alt="" class="w21em" /></p>

<p class="footnote">oremIpsum loremIpsum oremIpsum loremIpsum<img src="image/pic027.jpg" alt="" class="w0em2" />oremIpsum loremIpsum<img src="image/pic028.jpg" alt="" class="w0em2" />\``;
let m;

while ((m = regex.exec(str)) !== null) {
    // This is necessary to avoid infinite loops with zero-width matches
    if (m.index === regex.lastIndex) {
        regex.lastIndex++;
    }
    
    // The result can be accessed through the `m`-variable.
    m.forEach((match, groupIndex) => {
        console.log(`Found match, group ${groupIndex}: ${match}`);
    });
}

Ruby 测试

re = /((<img)([A-Za-z0-9"'=_\-.\/\s]+)(\/>))/m
str = '<p class="pic"><img src="image/pic003.jpg" alt="" class="w21em" /></p>

<p class="footnote">oremIpsum loremIpsum oremIpsum loremIpsum<img src="image/pic027.jpg" alt="" class="w0em2" />oremIpsum loremIpsum<img src="image/pic028.jpg" alt="" class="w0em2" />`'

# Print the match result
str.scan(re) do |match|
    puts match.to_s
end

用于匹配 Ruby 中的 img 标签的正则表达式

RegEx for matching img tags in Ruby

regex

ruby-on-rails

gsub

regex-group

ruby-on-rails-4

正则表达式

正则表达式电路

JavaScript演示

Ruby 测试