Question

我有一个字符串：'4 0 13 0 0 30 32 0 14 9 27 0 27 20 4 0 22 0'。我希望我的RegEx找到的值包含在名为targetValue的变量中。在这种情况下，targetValue碰巧等于0，我希望所有匹配都用更大胆的文本替换。这是基本代码：

＆＃13;

function startReplacing(){
  var targetValue = 0;
  var replacer = ' <b> ' + targetValue + ' </b> ';
  var re = new RegExp('\\s'+targetValue+'\\s','gi');

  var str = document.getElementById('string').innerHTML;
  str = str.replace(re, replacer);

  document.getElementById('string').innerHTML = str;
}

＆＃13;

b{ font-size:125% }

＆＃13;

<p id="string"> 4 0 13 0 0 30 32 0 14 9 27 0 27 20 4 0 22 0 </p>
<button onclick="startReplacing()">REPLACE</button>

＆＃13;

点击＆＃34; REPLACE＆＃34;您是否注意到值＆＃34; 30＆＃34; 之前的＆＃34; 0＆＃34; ？我的RegEx 错过了这个值。如何更改我的代码以解决此问题？

注意：我的RegEx错过了第一场比赛后应立即匹配的所有值。

Answer 1

您的正则表达式尝试匹配数字前面的空格和数字后的空格。如果两个数字之间只有一个空格，则它们都不能匹配。

我怀疑你根本不想匹配空格，只需检查没有其他数字。请使用word boundary：

function startReplacing(){
  var targetValue = 0;
  var replacer = ' <b> ' + targetValue + ' </b> ';
  var re = new RegExp('\\b'+targetValue+'\\b','g');
//                     ^^^               ^^^

  var str = document.getElementById('string').innerHTML;
  str = str.replace(re, replacer);

  document.getElementById('string').innerHTML = str;
}

b{ font-size:125% }

<p id="string">4 0 13 0 0 30 32 0 14 9 27 0 27 20 4 0 22 0</p>
<!-- works without leading and trailing spaces even -->
<button onclick="startReplacing()">REPLACE</button>

Answer 2

第一次匹配'0'时，它将消耗紧跟在它之后的空间，因此它不会在它之后的下一个'0'可用。您可以通过使用与空间匹配但不会消耗它的前瞻来解决这个问题，以便下一次它仍然存在。

function startReplacing(){
  var targetValue = 0;
  var replacer = ' <b> ' + targetValue + ' </b> ';
  var re = new RegExp('\\s'+targetValue+'(?=\\s)','gi');

  var str = document.getElementById('string').innerHTML;
  str = str.replace(re, replacer);

  document.getElementById('string').innerHTML = str;
}

b{ font-size:125% }

<p id="string"> 4 0 13 0 0 30 32 0 14 9 27 0 27 20 4 0 22 0 </p>
<button onclick="startReplacing()">REPLACE</button>

为什么如果紧接第一个匹配后，RegEx会忽略第二个匹配？

2 个答案: