javascript - 点击添加句子+数组编号，结果每行

Question

我开始学习如何编码，我想这对你来说真的很容易，但我很难找到如何去做。

我希望能够添加一个数字并存储该数字并获得如下结果:

假设我输入了数字 2，然后是 34，然后是 65 和 234。

结果是这样的:

<integer>2</integer>
<integer>34</integer>
<integer>65</integer>
<integer>234</integer>

你明白我的意思了吗？我需要整数字符串加上我键入的任何数字，结果需要添加一个 br。

function myFunction() {
  var x = parseFloat(document.getElementById("numb").value);
  var result = document.getElementById("result");
  var array = [];

  array.push("<integer>" + x + "</integer>");
  console.log(array);
  result.innerHTML = array;

}

<h1>Integer</h1>
<h2>Enter number</h2>

<input type="number" id="numb">
<button id="submitbutton" type="button" onclick="myFunction()">Submit</button>


<h1>
  <div>Result: <span id="result"> xxx </span></div>
</h1>

Answer 1

1. 将 var 数组移出函数作用域，这样就不会每次都创建一个新数组
2. 加入阵营
3. 使用 CSS 标记您的整数标签

PS:如果你想看到标签。将下面的代码更改为

array.push("<integer>" + parseInt(x) + "</integer>");

这里的标签是样式化的

var array = [];

function myFunction() {
  var x = document.getElementById("numb").value.trim();
  var result = document.getElementById("result");

  if (!isNaN(x) && x!="") { // test valid number
    array.push("<integer>" + parseInt(x) + "</integer>");
   //  console.log(array);
    result.innerHTML = array.join("<br/>");
  }

}

integer { font-weight:bold; color:teal }

<h3>Integer</h3>
<h4>Enter number</h4>
<input type="number" id="numb">
<button id="submitbutton" type="button" onclick="myFunction()">Submit</button>


<h1>
  <div>Result: <span id="result"> xxx </span></div>
</h1>