Javascript 在比较单词中的字母时不区分大小写

Question

我有这个练习，用户输入一个词然后输入一个字母以查看该字母在该词中出现了多少次。该项目的这一部分工作得很好。但是，我想让它不区分大小写，因为现在不是。我想为大写字母创建一个变量，为小写字母创建一个变量，然后将这两个变量与 i 或 letter 变量进行比较就可以了。然而，它使计数器在单词中找到的字母数量加倍。有人能帮我吗？这是我的代码:

function checkWordAndLetter() {
  var userWord = $("#word").val();
  console.log(userWord);
  var userLetter = $("#letter").val();
  console.log(userLetter);
  var letterUpperCase = userLetter.toUpperCase();
  var letterLowerCase = userLetter.toLowerCase();
  var tally = 0;
  for (i = 0; i < userWord.length; i++) {
    if (userLetter == userWord[i] && i == letterUpperCase ||
      letterLowerCase) {
      tally++;
    }
  }
  console.log(tally);
  $("#letterResults").html(" There are " + tally + " " + userLetter + "'s  in the word " + userWord);
  console.log("apple");
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="mainPage">
  <h2>Find the Letter in the Word</h2>
  <h4>Enter a word and select a letter to see how many times that letter appears in the word</h2>
    <p>Enter below:</p>
    <br/> Word:
    <input id="word" type="text" name="word"><br/><br/> Letter: <input id="letter" type="text" name="letter"><br/><br/>
    <br/>
    <br/>
    <button id="submit" type="button" name="submit" onclick="checkWordAndLetter()">submit</button>
    <p id="letterResults"></p>
</div>

Answer 1

这里最简单的选择是，不更改其余代码，是等式的大写(或小写)两边，这样您就可以进行比较.

function checkWordAndLetter() {
  var userWord = $("#word").val();
  var userLetter = $("#letter").val();
  var userWordUpper = userWord.toUpperCase();
  var userLetterUpper = userLetter.toUpperCase();
  var tally = 0;
  for (var i = 0; i < userWord.length; i++) {
    if (userLetterUpper == userWordUpper[i]) {
      tally++;
    }
  }
  $("#letterResults").html(" There are " + tally + " " + userLetter + "'s in the word " + userWord);
}
$("#word,#letter").change(checkWordAndLetter)

checkWordAndLetter();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='text' id='word' value='hello'/>
<input type='text' id='letter' value='l' />
<div id='letterResults'></div>

---

在您的原始代码中，这一行:

if (userLetter == userWord[i] && i == letterUpperCase || letterLowerCase) {

可能是:

if (letterUpperCase == userWord[i] || letterLowerCase == userWord[i]) {

---

另一种选择可能是使用 .split()，它通过在指定字符处断开将字符串分隔到数组中。通常这将是 ,，但您可以使用任何字母:

var tally = userWordUpper.split(userLetterUpper).length - 1;

function checkWordAndLetter() {
  var userWord = $("#word").val();
  var userLetter = $("#letter").val();

  var userWordUpper = userWord.toUpperCase();
  var userLetterUpper = userLetter.toUpperCase();

  var tally = userWordUpper.split(userLetterUpper).length - 1;

  $("#letterResults").html(" There are " + tally + " " + userLetter + "'s in the word " + userWord);
}
$("#word,#letter").change(checkWordAndLetter)

checkWordAndLetter();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='text' id='word' value='hello' />
<input type='text' id='letter' value='l' />
<div id='letterResults'></div>

---

另一个选项将用于正则表达式(编辑:参见 Rory 的回答，无需在此处重复)- 正则表达式的好处是您无需先转换为上/下。