javascript - 如何在输入中检索值？

我正在尝试检索输入中的值，但是我不太确定如何执行此操作。

这是我的代码：

<body onload="displayMessage()">
  <h1> JavaScript Arrays</h1>
  <br>
  <form name="hey">
    Enter value:
    <br>
    <input type="" name="firstname" value="">
    <br>
    <button type="button" onclick="displayMessage()">Add to list</button>
  </form>

  <p></p>

  <p id="pie"></p>

  <br>

  <p id="beef"></p>

</body>

最佳答案

您在+之后缺少"The user entered: "符号，并且我想您想将userInput而不是"Arrays"推入数组。

我还使用了.insertAdjacentHTML()，这样您就不会覆盖原始的.innerHTML设置。通过将pie元素存储在变量中，我也缩短了代码。

var Arrays = ["Printer", "Tablet", "Router", "Smart phone", "Motherboard", "Hard drive"];
document.getElementById("beef").innerHTML = Arrays;


function displayMessage() {
  var userInput = document.hey.firstname.value;
  var pie = document.getElementById("pie");

  // ----------------------------------v
  pie.innerHTML = "The user entered: " + userInput + "<br>";

  Arrays.push(userInput); // <------------ push the new item

  // Prevent overwrite--v
  pie.insertAdjacentHTML("beforeend", Arrays);
}

<h1> JavaScript Arrays</h1>
<br>
<form name="hey">
  Enter value:
  <br>
  <input type="" name="firstname" value="">
  <br>
  <button type="button" onclick="displayMessage()">Add to list</button>
</form>

<p></p>

<p id="pie"></p>

<br>

<p id="beef"></p>

其余的是正确的。

但是，除此之外，将小写单词用作变量名是一个好主意。这是常用的JavaScript约定。