Question

我得到一个字符串作为输入，字符串的每个单词中的最后一个字母应该大写，然后它形成自己的div。

我觉得棘手的一件事是，无论字符串是什么，都应该总是有足够的div来分隔，这对我来说意味着我需要有一个生成它的循环，是我不知道如何写这个逻辑。

我需要这个作为输出：

<div>
partY
</div>
<div>
likE
</div>
<div>
itS
</div>
<div>
2015
</div>

这是我到目前为止所做的：

function yay (input) {

  input = input.toLowerCase().split("").reverse().join("").split(" ");
  for(var i = 1 ; i < input.length ; i++){
    var len = input[i].length-1;
    input[i] = input[i].substring(0, len) + input[i].substr(len).toUpperCase();
  }
  return input .reverse().join(" ");
}

console.log(yay("Party like its 2015"));

Answer 1

您可以使用document.createElement('div')和document.createTextNode('text')来获得所需内容。

您可以直接返回内容元素以附加到您需要的节点，或者您可以使用innerHTML进行一些文本操作。

修改

修改后，我完全错过了最后一个字符需要大写

function yay(str) { var arr = str.split(' '); var content = document.createElement('div'); for(var part in arr) { var sub = document.createElement('div'); var lastChar = arr[part].charAt(arr[part].length-1).toUpperCase(); var appendStr = arr[part].substring(0,arr[part].length-1); sub.appendChild(document.createTextNode(appendStr+lastChar)); content.appendChild(sub); } return content.innerHTML; } console.log(yay("Party like its 2015"));

Answer 2

好吧，只是对你的代码做了一些小改动，这是在正确的轨道上...我基本上删除了不必要的反转并将每个单词包裹在循环和中提琴中的div中：

function yay (input) {

  input = input.toLowerCase().split(" ");
  for(var i = 0 ; i < input.length ; i++){
    var len = input[i].length-1;
    input[i] = '<div>'+input[i].substring(0, len) + input[i].substr(len).toUpperCase()+'</div>';
  }
  return input.join("");
}

console.log(yay("Party like its 2015"));
document.write(yay("Party like its 2015"));

输出：

<div>partY</div><div>likE</div><div>itS</div><div>2015</div>

Answer 3

这个怎么样：

＆＃13;

function capitalizeLastLetter(input) {
    return input.substring(0, input.length - 1) + input.charAt(input.length - 1).toUpperCase();
}

function yay(input) {
  return input
    .toLocaleLowerCase()
    .split(" ")
    .map(function(s){ return "<div>" + capitalizeLastLetter(s) + "</div>"; })
    .join("");
}

console.log(yay("Party like its 2015"));
document.write(yay("Party like its 2015"));

＆＃13;

重新混音this answer，了解如何将单词的第一个字母大写。

如果您确实需要输出中的那些，请在适当的位置添加换行符。

Answer 4

您可能希望使用String.prototype.replace并使用正则表达式提供它：

function yay(input) {
  return input.
         toLocaleLowerCase().
         replace(/([^\s.,:;!?]*)([^\s.,:;!?")])([^\s]*)/g,
             function(match, sub1, sub2, sub3) {
           return '<div>' + sub1 + sub2.toLocaleUpperCase() + sub3 + '</div>';
         });
}

正则表达式捕获零或更多（因为正则表达式默认为“贪婪”，算法将捕获尽可能多的字符）非空格（以支持拉丁语以外的字母）和非标点符号以及正好一个跟随它们的非空格/非标点字符（单词中的最后一个字母，即使它是构成单词的唯一字母）。最后一组是先前指定的标点符号（.,:;!?")）中的零个或多个。它所说的是“非空白字符”，但前两个括号内组的存在意味着它必须是一个标点符号。

此处的替换回调使用四个参数，一个（在本例中未使用）用于整个匹配，三个用于与正则表达式中带括号的组对应的子匹配。

从回调中返回的值将替换每个后续替换周期中的整个匹配（abcd中的abcd efgh将替换为<div>abcD</div>，依此类推，请注意将保留空格）

在回调函数中，第一个子匹配包含除最后一个之外的单词中的所有字母。它按原样返回，但另一个匹配（这是最后一个字母）是大写的。可选地，如果原始输入中存在标点符号，则附加标点符号。然后将所有内容包装在<div> HTML标记中并返回。

您可以将yay函数返回的值分配给HTML元素的innerHTML属性，例如：

document.querySelector('#container').innerHTML = yay('Party like its 2015');

输入中存在的空格将保留。没有必要用新的行字符替换它们，因为所有的空格在HTML中都是相同的，并且会导致相同的行为。

修改现在，您可以将包含标点符号的输入传递给函数。以下一行：

yay('Hello there, how about using some punctuation? "Quote" (Parentheses) ("What?")')

将导致：

'<div>hellO</div> <div>therE,</div> <div>hoW</div> <div>abouT</div> <div>usinG</div> <div>somE</div> <div>punctuatioN?</div> <div>"quotE"</div> <div>(parentheseS)</div> <div>("whaT?")</div>'

你如何在JavaScript中创建div？

4 个答案: