Question

我的循环功能让我的元音计数器无法正常工作，我不知道我哪里出错了我想要一些帮助。

我试图让最常用的元音变粗，所以说我有A = 34 and E = 45所以E应该像这样大胆 E

但我不知道我是否遗漏了一些代码，或者我的代码中是否有错误。

这是我的JavaScript。

 function countVowels() {

     var text = document.getElementById("text").value;

     var arrayOfLetters = text.split("");

     // These are the counters for the program to find the vowels.
     var countA = text.match(/[Aa]/g).length;
     var countE = text.match(/[Ee]/g).length;
     var countI = text.match(/[Ii]/g).length;
     var countO = text.match(/[Oo]/g).length;
     var countU = text.match(/[Uu]/g).length;
     var countComma = text.match(/[,.!": ;?)(]/g).length;

     var bold = "<strong>";
     var vowels = new Array();
     vowels[0] = "countA";
     vowels[1] = "countE";
     vowels[2] = "countI";
     vowels[3] = "countO";
     vowels[4] = "countU";

     for (var i = 0; i < vowels.length; i++) {
         document.getElementById("result").innerHTML = i + vowels[i] + "<br />";

     }
     // This code will output the results.
     document.getElementById("result").innerHTML = "";
     document.getElementById("result").innerHTML += "Total Letters: " + arrayOfLetters.length + "<br />";
     document.getElementById("result").innerHTML += "A's: " + countA + "<br />";
     document.getElementById("result").innerHTML += "E's: " + countE + "<br />";
     document.getElementById("result").innerHTML += "I's: " + countI + "<br />";
     document.getElementById("result").innerHTML += "O's: " + countO + "<br />";
     document.getElementById("result").innerHTML += "U's: " + countU + "<br />";
     document.getElementById("result").innerHTML += "Punctuation: " + countComma + "<br />";
 }

这是我的HTML。

<div style="text-align: center;">
    <h1> Vowel Counter </h1>
    Please enter text for your vowel count:
    <br>
    <textarea id="text" rows="10" style="width: 100%;"></textarea>
    <br>
    <button onclick="countVowels();">Count Vowels</button>
    <p id="result"></p>

这是我的fiddle。

Answer 1

var result = "";
for(var i = 0; i < text.length ; i++){
 if(text[i] == vowelsmustusedUpCase || text[i] == vowelsmustusedLowCase ){
  result += "<strong>"+text[i]+"</strong>";
 } else {
  result += text[i];
 }
} 
document.getElementById("text").value = result ;

添加此项，但在textarea中您无法看到粗体

Answer 2

好的，这是代码审查/回答：

首先我修改了这些行：

var countA = text.match(/[Aa]/g).length;

要：

var countA = (text.match(/[Aa]/g) ? text.match(/[Aa]/g).length : 0);

当它返回＆＃34; 未捕获的TypeError：无法读取属性＆＃39; length＆＃39; null ＆＃34;如果元音没有出现在控件中。这会将其设置为0.

接下来，我将数组声明简化为：

var vowels = ["countA", "countE", "countI", "countO", "countU"];

然后我删除了这个没有做任何事情的部分，因为它稍后会被覆盖：

// does nothing
//    for (var i = 0; i < vowels.length; i++) {
//       document.getElementById("result").innerHTML = i + vowels[i] + "<br />";
//    }

然后我使用Math.max计算了最高计数：

var maxVal = Math.max(countA,countE,countI,countO,countU);

然后在输出中使值变为粗体，我创建了一个函数来将值与最大值进行比较：

function formatValue(val, max) {
    return (val === max) ? '<strong>' + val + '</strong>' : val;
}

所以你的最后一节会调用这个函数来输出这样的数字：

document.getElementById("result").innerHTML += "A's: " + formatValue(countA,maxVal) + "<br />";

Demo JS Fiddle

完成JS

function countVowels() {

    var text = document.getElementById("text").value;
    var arrayOfLetters = text.split("");

    // These are the counters for the program to find the vowels.
    var countA = (text.match(/[Aa]/g) ? text.match(/[Aa]/g).length : 0);
    var countE = (text.match(/[Ee]/g) ? text.match(/[Ee]/g).length : 0);
    var countI = (text.match(/[Ii]/g) ? text.match(/[Ii]/g).length : 0);
    var countO = (text.match(/[Oo]/g) ? text.match(/[Oo]/g).length : 0);
    var countU = (text.match(/[Uu]/g) ? text.match(/[Uu]/g).length : 0);
    var countComma = (text.match(/[,.!": ;?)(]/gi) ? text.match(/[,.!": ;?)(]/gi).length : 0);

    var bold = "<strong>";
    var vowels = ["countA", "countE", "countI", "countO", "countU"];       
    var maxVal = Math.max(countA,countE,countI,countO,countU);

    // This code will output the results.
    document.getElementById("result").innerHTML = "";
    document.getElementById("result").innerHTML += "Total Letters: " + arrayOfLetters.length + "<br />";
    document.getElementById("result").innerHTML += "A's: " + formatValue(countA,maxVal) + "<br />";
    document.getElementById("result").innerHTML += "E's: " + formatValue(countE,maxVal) + "<br />";
    document.getElementById("result").innerHTML += "I's: " + formatValue(countI,maxVal) + "<br />";
    document.getElementById("result").innerHTML += "O's: " + formatValue(countO,maxVal) + "<br />";
    document.getElementById("result").innerHTML += "U's: " + formatValue(countU,maxVal) + "<br />";
    document.getElementById("result").innerHTML += "Punctuation: " + countComma + "<br />";
}

function formatValue(val, max) {
    return (val === max) ? '<strong>' + val + '</strong>' : val;
}

Answer 3

我认为你应该首先找到哪个是最常用的元音，然后将它与输出中的结果行进行比较。 E.g：

vowelCount = { A: countA, E: countE, I: countI, O:countO, U:countU };

// Find vowel with maximum appearances
var vowelMaxCount = -1;
var vowelMostPopular = -1;
for(vowel in vowelCount) {
    if(vowelCount[vowel] > vowelMaxCount) {
        vowelMaxCount = vowelCount[vowel];
        vowelMostPopular = vowel;
    }
}

// This code will output the results.
document.getElementById("result").innerHTML = "";
document.getElementById("result").innerHTML += "Total Letters: " + arrayOfLetters.length + "<br />";
for(vowel in vowelCount) {
    v = (vowel == vowelMostPopular)?"<strong>"+vowel+"</strong>":vowel;
    document.getElementById("result").innerHTML += v+"'s: " + vowelCount[vowel] + "<br />";
}
document.getElementById("result").innerHTML += "Punctuation: " + countComma + "<br />";

演示小提琴：http://jsfiddle.net/lparcerisa/a8n947kw/1/

Answer 4

你似乎正在计算正确的数量。所以我猜的唯一问题是：

获取最大数量
以粗体显示

我提到this获取最大数量，然后对代码进行一些调整，以便以粗体显示最大数量。

var vowels = new Array ();
vowels [0] = {"vowel" : "A", "count" : countA};
vowels [1] = {"vowel" : "E", "count" : countE};
vowels [2] = {"vowel" : "I", "count" : countI};
vowels [3] = {"vowel" : "O", "count" : countO};
vowels [4] = {"vowel" : "U", "count" : countU};
var maxCount = Math.max.apply(Math, vowels.map(function(o) {
    return o.count;
}));

for (var i = 0; i < vowels.length; i++) {
    document.getElementById("result").innerHTML += (vowels[i].count == maxCount? "<B>" : "") + vowels[i].vowel + "'s: " + vowels[i].count + "<br />";
}

请参阅this updated fiddle。

循环功能不适用于元音计数器。如何使计数器文本变为粗体

4 个答案:

Demo JS Fiddle

完成JS