RegEx用于在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" />`

第一个应该返回：

[<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.*\>?/)的regEx，它输出了第一个类似

的正则表达式

["<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

RegEx

您可以在regex101.com中设计/修改/更改表达式：

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

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

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

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

RegEx电路

您可以在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