Question

如何在循环中重新生成代码？我想创建代码提示，然后使用提示的数字，执行以下代码。但是，即使输入数字，它仍会继续保持提示。

简而言之，我希望它执行num1提示，然后执行for循环并在Web浏览器上显示内容以及循环以同时重新提示num1。

var num = 10;
do {
  var num1 = prompt("Enter a number");
  for (num2 = 0; num2 < 11; num2++) {
  var sum = Number(num1) * Number(num2);
  document.write("<p>" + num1 + " X " + num2 + " = " + sum + "</p>");
  }
}
while (num == 10);

Answer 1

编辑：如果您希望在每次迭代之间添加延迟，请按以下步骤操作：

(function display (p) {

  var num1 = +prompt("Enter a number")
  
  for (var num2 = 0; num2 < 11; num2++) {
    p.textContent = num1 + " X " + num2 + " = " + (num1 * num2)
    document.body.appendChild(p.cloneNode(true))
  }
  
  (num1 == 10) || setTimeout(display, 500, p)
  
})(document.createElement('p'))

您的问题是num永远不会改变。您应该检查num1是否与10 - do循环中的特定数字（例如while）匹配，然后根据该条件退出：

do {
  var num1 = prompt("Enter a number");
  for (num2 = 0; num2 < 11; num2++) {
  var sum = Number(num1) * Number(num2);
  document.write("<p>" + num1 + " X " + num2 + " = " + sum + "</p>");
  }
}
while (num1 != 10);

Answer 2

首先，你的结束条件是你根本不使用的变量，它应该是相反的意义，因为条件决定了何时继续循环，而不是何时退出（因此，{{1 }}）。

其次，Chrome会在更新浏览器页面之前先处理Javascript，并且由于prompt完全阻止了Javascript，因此您看不会使用document.write编写的内容更新页面。只有当循环可以退出时，您才会看到页面上的实际更改。这是它在Chrome中的工作原理。其他浏览器执行与prompt（例如Firefox）一起在页面上显示结果。

以下是基于计时器的解决方法：

var timer = setInterval(function () {
    var num1 = prompt("Enter a number");
    for (num2 = 0; num2 < 11; num2++) {
        var sum = Number(num1) * Number(num2);
        // Add HTML. Don't use document.write as it will clear the page.
        document.body.insertAdjacentHTML('beforeend',  
           "<p>" + num1 + " X " + num2 + " = " + sum + "</p>");
    }
    if (num1 == 10) clearInterval(timer); // stop repeating
}, 100); // Allow 100ms time for Chrome to update page

由于您的代码现在以异步方式运行，因此您应该放弃使用document.write，如果异步运行，则会清除您的页面。因此，最好始终避免使用document.write。

Javascript：如何通过整个代码执行并再次循环

2 个答案: