Question

我有一个字符串，每个逗号都将其拆分为一个数组。然后，我遍历数组，并将每个元素一个一个地添加到字符串中，但使用换行符将它们分隔开。

var beg2 = document.twocities.begins.value;
var ans22 = "";
var words2 = beg2.split(",");

for(var i=0; i<words2.length; i++){
    ans22 += words2[i] + "<br>"; 
}

document.getElementById("ans22").innerHTML = ans22;

现在我正在尝试使用此代码将每一行的首字母大写，但只有整个字符串的首个字母最终变成大写，而不是每一行的首字母。

var ans23 = "";

for (var i=0; i<words2.length; i++){
    firstLetter = words[i].charAt(0);
    firstLetterCap = words[i].charAt(0).toUpperCase();
    words[i].replace(firstLetter,firstLetterCap);
    ans23 += words2[i] + "<br>"; 
}

任何建议将不胜感激。

Answer 1

您可以使用map来简化此操作，方法是将句子中的每个单词转换为大写形式，然后将数组重新组合成一个句子：

var sentence = 'hello world test';
var capitalized = sentence
                  .split(' ')
                  .map(w => w.charAt(0).toUpperCase() + w.slice(1))
                  .join('<br>');

console.log(capitalized);

Answer 2

您不需要使用.replace()。使用.charAt(0)选择字符串的第一个字符，然后使用.slice()选择字符串的下一个部分

var beg2 = "first,second,third";
var ans22 = "";
var words = beg2.split(",");

for (var i=0; i<words.length; i++){
  words[i] = words[i].charAt(0).toUpperCase() + words[i].slice(1);
  ans22 += words[i] + "<br>"; 
}
document.getElementById("ans22").innerHTML = ans22;

<div id="ans22"></div>

您还可以使用CSS ::first-letter伪元素和text-transform属性来完成这项工作。

var str = "first,second,third";
document.getElementById("ans22").innerHTML = str.split(",").map(function(val){
  return "<div>"+val+"</div>"
}).join("");

#ans22 div::first-letter {
  text-transform: capitalize;
}

<div id="ans22"></div>

使用JavaScript将每个数组元素的首字母大写

2 个答案: