Question

我试着寻找答案，但没有答案适合我的需要......

这是我的代码：

<div><svg onclick="addIngredient('Bacon', -1);"><path></path></svg>
<button onclick="addIngredient('Bacon', 1);"></button><p>6 Bacon</p></div>

<div><svg onclick="addIngredient('Paprika', -1);"><path></path></svg>
<button onclick="addIngredient('Paprika', 1);"></button><p>3 Paprika</p></div>

<div><svg onclick="addIngredient('Sliced Meat', -1);"><path></path></svg>
<button onclick="addIngredient('Sliced Meat', 1);"></button><p>1 Sliced Meat</p></div>

我想捕捉之间的话 svg onclick="addIngredient('和'

之后的话。因此，我想要检索单词Bacon，Paprika或Sliced Meat

我尝试过这样做，但它没有工作......

var stringy = '<div><svg onclick="addIngredient('Bacon', -1);"><path></path></svg>
<button onclick="addIngredient('Bacon', 1);"></button><p>6 Bacon</p></div>

<div><svg onclick="addIngredient('Paprika', -1);"><path></path></svg>
<button onclick="addIngredient('Paprika', 1);"></button><p>3 Paprika</p></div>

<div><svg onclick="addIngredient('Sliced Meat', -1);"><path></path></svg>
<button onclick="addIngredient('Sliced Meat', 1);"></button><p>1 Sliced Meat</p></div>';

var result = stringy.match("svg onclick="addIngredient(([^}]*)')");
console.log(result);

我该怎么做？

Answer 1

您可以使用以下正则表达式。它使用.*?匹配可能的最少字符，直到下一个'

<svg.+?onclick="addIngredient\('(.*?)'

这是一个正在运行的例子。您需要使用.exec()函数才能获得每个出现的$1组。

var stringy = document.getElementById("main").innerHTML; // read the HTML instead of hard-coding it here as a string
var regex = /<svg.+?onclick="addIngredient\('(.*?)'/g;
var match = regex.exec(stringy);

while(match !== null) {
    console.log(match[1]);
    match = regex.exec(stringy);
}

<div id="main">
    <div><svg onclick="addIngredient('Bacon', -1);"><path></path></svg>
    <button onclick="addIngredient('Bacon', 1);"></button><p>6 Bacon</p></div>

    <div><svg onclick="addIngredient('Paprika', -1);"><path></path></svg>
    <button onclick="addIngredient('Paprika', 1);"></button><p>3 Paprika</p></div>

    <div><svg onclick="addIngredient('Sliced Meat', -1);"><path></path></svg>
    <button onclick="addIngredient('Sliced Meat', 1);"></button><p>1 Sliced Meat</p></div>
</div>

只是为了提高你的正则表达能力，解释你的错误：

var regex = "svg onclick="addIngredient(([^}]*)')";
                         ^             ^   ^ ^  ^

您需要使用"转义\，因为您的整个正则表达式都包含在“（JavaScript strings）
您需要使用斜杠转义(，因为括号是正则表达式组的开头。
为什么你要找一个没有}的集合？您可以查找任何字符（.）。
如果您使用的*没有?，那么它将是贪婪的，只会在文档的最后一次出现时停止。通常，您希望选择器不要贪心。
最后一个括号也是一个特殊字符，需要转义。您不需要此支架，因为显然已经足够停在'。

正则表达式选择beween（＆＃39;和＆＃39;

1 个答案: