Question

我正在尝试更好地做这件事并一直在玩字符串。我要做的是将用户输入收集为字符串并对其进行操作，以便在显示文本时，无论他们编写什么内容都将首先以小写显示，然后全部大写，然后将所有文本划分为自己的文本线。

所以，如果我输入，输出将是这样的：这是一个例子

这是一个例子

此

是

的

例如

我觉得这应该比它看起来容易得多，但我到目前为止尝试全部小写，但到目前为止无法使用（以及其他两个部分）。我认为如果我得到小写的正确，我只是重复大写并分裂它。

    <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>

以上是我到目前为止所使用的内容，当我点击按钮进行测试时，我得到了不确定。有人可以帮我编辑吗？

Answer 1

使用()
您的变量为person而不是test
您希望在space而非\n
你想ADD来测试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>

Answer 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 />');
    }
}

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

2 个答案: