获取正则表达式 .replace() 发生的次数

Question

我正在构建一个 html linter，我要做的第一件事是删除所有 alt 属性。我正在使用正则表达式来替换 alt 标签。有没有办法删除数字替代代码。

如果你粘贴：

alt="23432" 一二三 alt='12312' 四五六 alt = "1124412"

你应该得到一二三四五六，我想将 3 存储到一个名为 numReplaced 的变量中。

function removeAlts(input) {
	var textIn = document.getElementById("textIn").value;
	var regex = /alt\s*=\s*[\"\'][a-zA-z0-9\s]*[\"\']/ig;
	var textOut = textIn.replace(regex, '');
	document.getElementById("textIn").value = textOut;
  //var numReplaced = ????
}

<button class="btn" onclick="removeAlts()">Remove Alts</button>
<div class="title">
	<h3>Paste code in box below and press button to remove alts!</h3>
</div>
<textarea name="input" id="textIn" cols="60" rows=15"></textarea>

Answer 1

一种选择是使用替换函数，并在每次调用时递增一个计数器。您还应该将您的正则表达式修复为 capture alt 属性中的初始双引号或单引号，以便稍后可以将其与反向引用匹配。使用这种反向引用策略，您还可以将alts 与其中的引号相匹配，因此将"' 添加到字符集中。

此外，您可以使用i 标志而不是重复[a-zA-Z，以及\d 而不是0-9。此外，引号不需要在正则表达式文字中进行转义。

function removeAlts(input) {
  var textIn = document.getElementById("textIn").value;
  var regex = /\s*alt\s*=\s*(["'])[a-z\d\s"']*?\1/ig;
  let counter = 0;
  var textOut = textIn.replace(regex, () => {
    counter++;
    return '';
  });
  document.getElementById("textIn").value = textOut;
  console.log(counter);
}

<button class="btn" onclick="removeAlts()">Remove Alts</button>
<div class="title">
  <h3>Paste code in box below and press button to remove alts!</h3>
</div>
<textarea name="input" id="textIn" cols="60" rows="15">
  <tag alt="foo"></tag>
  <tag alt="bar"></tag>
  <tag alt="that's okay"></tag>
</textarea>

但是使用DOMParser 搜索具有alt 属性的所有内容并删除它们会更优雅

function removeAlts(input) {
  var textIn = document.getElementById("textIn").value;
  const doc = new DOMParser().parseFromString(textIn, 'text/html');
  const alts = doc.querySelectorAll('[alt]');
  console.log(alts.length);
  alts.forEach(elm => elm.removeAttribute('alt'));
  document.getElementById("textIn").value = doc.body.innerHTML;
}

<button class="btn" onclick="removeAlts()">Remove Alts</button>
<div class="title">
  <h3>Paste code in box below and press button to remove alts!</h3>
</div>
<textarea name="input" id="textIn" cols="60" rows="15">
  <tag alt="foo"></tag>
  <tag alt="bar"></tag>
  <tag alt="that's okay"></tag>
</textarea>

Answer 2

您可以在模式的末尾使用相同的引号，如下所示：
/alt\s*=\s*(["']).+\1/ig