如何实现统计文本框高频词并弹窗显示的JavaScript功能？

你的现有代码只是在统计连续重复的单个字符，完全没实现词频统计的逻辑，而且counter变量未初始化，运行会出现NaN错误。下面是能实现你需求的完整代码：

修改后的JavaScript代码 #

function countWords() {
    // 获取输入文本
    let input = document.getElementById("input").value.trim();
    // 处理空输入情况
    if (!input) {
        alert("请输入文本内容");
        return;
    }

    // 文本预处理：转小写、去除标点、拆分单词
    const words = input.toLowerCase().replace(/[^\w\s]/g, "").split(/\s+/);
    // 统计词频的对象
    const wordCounts = {};

    // 遍历单词，统计每个词的出现次数
    words.forEach(word => {
        if (word) { // 排除空字符串（比如连续空格导致的）
            wordCounts[word] = (wordCounts[word] || 0) + 1;
        }
    });

    // 找出频率最高的词和次数
    let maxCount = 0;
    let mostFrequentWord = "";
    for (const word in wordCounts) {
        if (wordCounts[word] > maxCount) {
            maxCount = wordCounts[word];
            mostFrequentWord = word;
        }
    }

    // 弹窗显示结果
    alert(`文本框中出现频率最高的词是‘${mostFrequentWord}’，共${maxCount}次`);
}

修改后的HTML代码 #

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="main.js"></script>
</head>
<body>
    <textarea id="input" rows="30" cols="30"></textarea><br>
    <button type="button" onclick="countWords()">Count Repeated Words</button>
</body>
</html>

关键逻辑说明 #

• 文本预处理：把输入转成小写，避免大小写差异导致同词被重复统计；用正则去除标点符号，确保Hello!和Hello被识别为同一个词；按空格拆分单词，处理连续空格的情况。
• 词频统计：用对象存储每个词的出现次数，遍历单词时更新计数。
• 找最高频词：遍历统计对象，记录次数最多的词和对应的次数。
• 异常处理：加入空输入判断，避免无内容时出现错误。

内容的提问来源于stack exchange，提问作者Caz