问题

Question

我是regex的新手并正在练习它。首先看看这段代码：

$(".app").each(function(){
    var raw_string = $(this).html();
    var changed_string = raw_string.replace(/^\{\{|\}\}$/g, "");
    $(this).html(eval(changed_string));
});

我正在尝试查看.app的HTML并搜索以胡须{{开头且以胡须}}结尾的任何内容。就像Mustache.js一样。首先，我将其替换为空字符串，然后将.app的HTML设置为eval(changed_string)。所以，如果我尝试：

<div class="app">

    {{2+2}}

</div>

完美打印4.但是：

问题

如果我向.app添加一些额外的HTML：

<div class="app">

    2 and 2 are: {{2+2}}

</div>

输出结果为：

2 and 2 are: {{2+2}}

发生了什么???

JsFiddle Demonstration

Answer 1

修复表达式（你匹配字符串的开头/结尾）仍然无法解决问题;你会尝试评估整个字符串，包括“2和2是：......”。

试试这个，替换每个{{...}}对中的内容：

$(".app").each(function(){
    var raw_string = $(this).html();
    var changed_string = raw_string.replace(/\{\{(.+)\}\}/g, 
      function( match, p1 ) {
        return(eval(p1));
      }                                     
    );
    $(this).html(changed_string);
});

Answer 2

问题是你的.replace（...）没有捕捉到胡须之间的东西，它只是删除胡须。因此，在第二种情况下，您将尝试评估字符串而不是有效表达式，即eval("2 and 2 are: 2+2");

修复是针对捕获组()的.exec或.match，并提取捕获的字符串以进行评估。

    $(".app").each(function(){
        var raw_string = $(this).html();
        var reg = new RegExp(/\{\{(.*)\}\}/);
        var formula = reg.exec(raw_string); // captures orig string in formula[0], first match in formula[1]
        $(this).html(eval(formula[1]));
    });

正则表达式：在某些情况下不起作用

问题

发生了什么???

2 个答案: