如何在用户输入中写入数组的编号并获取该特定数组编号的信息？

Question

我需要帮助做功课。这是我坚持了一段时间的任务。以下是任务说明：

创建一个包含单词“Hej”、“Nej”、“EJ”、“Leverpastej”、“42”的数组。通过表单，用户必须能够写一个数字，然后你应该在数组中显示位置的单词。例如：输入用户2，应该显示“EJ”这个词。

好吧，老实说，我对这项任务感到非常迷茫，我需要我能得到的所有帮助和建议。所以请帮助我。也许建议我如何使用 for 循环或类似的东西。

谢谢！

    function getFunction() {

        var rimm [];

        rimm[0] = "Hej";

        rimm[1] = "Nej";

        rimm[2] = "EJ";

        rimm[3] = "Leverpastej";

        rimm[4] = "42";

        for (var i = 0; i < rimm.length; i++) {

            if (rimm[i] == "Nej") {

                document.getElementById("skit").innerHTML += " " + rimm[i];

            }

            else {

                document.getElementById("skit").innerHTML += " " + rimm[i];

            }

            document.getElementById("getnumber").value = rimm[];

    }

<input type="text" id="getnumber">

<input type="button" value="Get" onclick="getFunction()">

<p>Skriv ut Skiten:</p><div id="skit"></div>

Answer 1

这比您尝试做的要简单得多。您可以直接按数字访问数组元素，无需循环。只需i从输入和输出中获取rimm[i]。var rimm = ["Hej", "Nej", "EJ", "Leverpastej", "42"];function getFunction() {&nbsp; &nbsp; var i = document.getElementById("getnumber").value;&nbsp; &nbsp; document.getElementById("skit").textContent = rimm[i];}<input type="text" id="getnumber"><input type="button" value="Get" onclick="getFunction()"><p>Skriv ut Skiten:</p><div id="skit"></div>您可能需要检查数字是否有效以及是否在数组大小的范围内。我把这留给你。注意：使用textContent比更好innerHTML，因为后者真正用于显示 HTML 编码的内容。除非这是您的意图，否则就是textContent要走的路。

Answer 2

这是您可以采取的一种方法。我在用户输入上使用了一个事件处理程序和一些验证：var words = ["Hej", "Nej", "EJ", "Leverpastej", "42"];//Target our important elementsconst userInputEl = document.querySelector('#userInput');const outputEl = document.querySelector('#output');//Fuction to validate the user inputconst validateInput = input => {&nbsp; if (isNaN(input)) {&nbsp; &nbsp; outputEl.innerHTML = 'A number value is required!';&nbsp; &nbsp; return false;&nbsp; }&nbsp; if (input > (words.length - 1)) {&nbsp; &nbsp; outputEl.innerHTML = `The value must be between 0 and ${words.length - 1}`;&nbsp; &nbsp; return false;&nbsp; }&nbsp; return true;};//Add an event listener that will fire when the value in the text input is changeduserInputEl.addEventListener('change', e => {&nbsp; if (validateInput(e.target.value))&nbsp; &nbsp; outputEl.innerHTML = words[e.target.value];});<input id="userInput" type="text"><div id="output"></div>