转换为小写、大写，然后将字符串拆分成自己的行答案

【问题标题】：Convert to lowercase, uppercase, and then split the string into its own lines转换为小写、大写，然后将字符串拆分成自己的行
【发布时间】：2018-08-30 01:14:54
【问题描述】：

我正在尝试更好地完成此操作，并且一直在玩弦乐。我想要做的是将用户输入作为字符串收集并对其进行操作，以便当我显示文本时，他们写的任何内容都将首先以全部小写形式显示，然后全部以大写形式显示，然后将所有文本分成自己的行。

所以，如果我输入，输出将是这样的：This is an example

这是一个例子

这个

是

一个

例子

我觉得这应该比看起来容易得多，但到目前为止我正在尝试做一个全小写，但到目前为止还不能让它工作（以及其他两个部分）。我认为如果我把小写字母写对了，我只需对大写字母重复同样的事情并拆分它。

    <button onclick="myFunction()">Try it</button>

<p id="test"></p>

<script>
function myFunction() {
    var person = prompt("Please enter a phrase");
    if (person != null) {
        document.getElementById("test").innerHTML =
        test.toLowerCase;
        document.getElementById("test").innerHTML =
        test.toUpperCase;
        document.getElementById("test").innerHTML =
        test.split("\n");
    }
}
</script>

以上是我目前正在玩的，当我单击按钮进行测试时，我得到了不确定。有人可以帮我编辑吗？

【问题讨论】：

toLowerCase 等是函数 .... 所以你需要 () - 而且，它们返回一个新字符串，所以你需要说 something = x.toLowerCase() （哦，你做到了，你将行拆分为完全没有理由降低代码的可读性）另外，您对同一事物有三个分配 - 只会显示最后一个 - 最后，test 将是具有该 ID 的 p 元素......所以，不是字符串，所以没有 toLowerCase 等方法
如果你在\n上拆分，你不会把空格转换成\n ...我认为你需要学习一些javascript基础知识
请注意，除非您有意插入 HTML 标记，否则通常分配给 .textContent 会更好、更安全。

标签： javascript split uppercase lowercase

【解决方案1】：

使用()调用函数
你的变量是person 不是test
你想在space而不是\n上拆分
您要添加测试 innerHTML，而不是每次都替换它
要在 HTML 中获取换行符，请使用 <br> 标记

我已经使用了一次分配 innerHTML 的代码，因为这比一次添加一点性能更高 - 当然，对于这样一个简单的示例，没有明显的区别，但是我想我应该提一下为什么我选择使用这种奇怪的方法

function myFunction() {
    var person = prompt("Please enter a phrase");
    if (person != null) {
        document.getElementById("test").innerHTML = [
          person.toLowerCase(),
          person.toUpperCase(),
          person.split(" ").join('<br>')
        ].join("<br>");
    }
}

<button onclick="myFunction()">Try it</button>
<p id="test"></p>

【讨论】：

这很完美！非常感谢，我理解我的错误！

【解决方案2】：

您可能希望先将字符串拆分为单词，然后使用带有<br /> 标签的 join() 函数将它们呈现为多行单词。

function myFunction() {
    var person = prompt("Please enter a phrase");
        if (person != null) {
            document.getElementById("test").innerHTML +=
        person.toLowerCase() + "<br />";
        document.getElementById("test").innerHTML +=
        person.toUpperCase() + "<br />";
        document.getElementById("test").innerHTML +=
        person.split(' ').join('<br />');
    }
}

【讨论】：