Javascript-在div元素上输入提示

Question

我想立即在循环中在id = results的div元素上从提示符显示用户输入。但是，提示会连续运行6次，然后所有输入都将打印在div中。我希望每个输入在每次快速输入后一次打印在div上。

for (let i = 0; i < 7; i++) {
  var x = parseInt(prompt("Enter a number"));
  h1 = document.createElement('h1');
  var result = document.createTextNode('Your inputs are: ' + x);
  h1.appendChild(result);
  document.getElementById('results').appendChild(h1);
}

<div id="results"></div>

Answer 1

给接口时间以更新DOM

尝试以下方法：

let cnt = 7;
const addNum = () => {
  let x = parseInt(prompt("Enter a number"));
  h1 = document.createElement('h1');
  let result = document.createTextNode('Your inputs are: ' + x);
  h1.appendChild(result);
  document.getElementById('results').appendChild(h1);
  cnt--
  if (cnt > 0) setTimeout(addNum,100)
};
addNum();

<div id="results"></div>

Answer 2

我想您在Chrome浏览器中尝试过。它可以在Firefox中使用。