!DOCTYPE htmlhtmlheadtitle文本替换工具titleheadbodyh1文本替换工具h1p请输入您想要替换的内容：ptextarea id=replace-text rows=10 cols=50textareabrbutton onclick=replaceText替换buttonbrp替换后的文本内容：ptextarea id=output-text rows=10 co

<!DOCTYPE html>
<html>
<head>
<title>文本替换工具</title>
</head>
<body>
<h1>文本替换工具</h1>
<p>请输入您想要替换的内容：</p>
<textarea id="replace-text" rows="10" cols="50"></textarea>
<br>
<button onclick="replaceText()">替换</button>
<br>
<p>替换后的文本内容：</p>
<textarea id="output-text" rows="10" cols="50"></textarea>
<p>出现了<span id="comma-count">0</span>个逗号。</p>
<script>
	function replaceText() {
		var inputText = document.getElementById("replace-text").value;
		var replacedText = inputText.replaceAll(" ", ",");
		replacedText = replacedText.replaceAll("\n", ",");
		replacedText = replacedText.replaceAll("\"", ",");
		replacedText = replacedText.replaceAll(",,", ",");
		replacedText = replacedText.replaceAll(",,", ",");
		replacedText = replacedText.replaceAll(",,", ",");
		replacedText = replacedText.replaceAll(",,", ",");
		replacedText = replacedText.replaceAll(",,", ",");
		replacedText = replacedText.replaceAll(",,", ",");
		replacedText = replacedText.replaceAll(",,", ",");
		replacedText = replacedText.replaceAll(",,", ",");
		replacedText = replacedText.replaceAll(",,", ",");
		document.getElementById("output-text").value = replacedText;
		document.getElementById("comma-count").innerHTML = (replacedText.match(/,/g) || []).length;
	}
</script>
</body>
</html> 
<p>在原有代码的基础上，我们添加了一个新的段落，用来显示逗号出现的次数。我们给这个段落设置了一个id为&quot;comma-count&quot;，方便后续的JavaScript代码调用。</p>
<p>在replaceText()函数中，我们使用了正则表达式来统计逗号出现的次数。具体来说，我们使用了match()函数和正则表达式/，/g来查找逗号。match()函数返回一个数组，其中包含了所有匹配的结果。如果没有匹配到任何结果，match()函数返回null，因此我们在后面使用 || [] 进行了处理，确保即使没有匹配结果也不会出错。</p>
<p>最后，我们将逗号出现的次数显示在了页面上，以方便用户查看。</p>