Fatal编程技术网

JavaScript循环输出

javascript loops

JavaScript循环输出,javascript,loops,screen,output,Javascript,Loops,Screen,Output,全部。我是JavaScript新手，希望这对大家来说都是一个非常简单的问题。但我绝对不知道该怎么做！我正在创建一个times table程序，我需要输出如下所示： 5x1=5 5x2=10 5 x 3=15 ……等等。但是，每当它输出到屏幕时，它只显示循环的最后一次输出。因此，它将显示“5x12=60”。我需要它在程序每次通过循环时显示每个单独的输出。我该怎么做呢 非常感谢 <!DOCTYPE HTML> <html lang="en-us"> <head>

全部。我是JavaScript新手，希望这对大家来说都是一个非常简单的问题。但我绝对不知道该怎么做！我正在创建一个times table程序，我需要输出如下所示：

5x1=5
5x2=10
5 x 3=15

……等等。但是，每当它输出到屏幕时，它只显示循环的最后一次输出。因此，它将显示“5x12=60”。我需要它在程序每次通过循环时显示每个单独的输出。我该怎么做呢

非常感谢

<!DOCTYPE HTML>
<html lang="en-us">
<head>
<meta charset="utf-8">

        <!-- 
        Input
            User clicks the "Compute Table" button.
        Processing
            The computer creates a times table based on the users' input.
        Output
            Outputs the table to the user.
        -->


<title>Times Table</title>
<script>
    function computeTable() {

    // Declaring some variables and pulling the integer from the HTML form. Nothing to see here.
    var integer = parseInt(document.getElementById('input').value);
    var i = 1;

    // Running the loop and doing all the arithmetic
    while (i < 12) {
        i++;
    }

    // This line displays the output to the user
    var output = document.getElementById('outputdiv');
    output.innerHTML = integer + " x " + i + " = " + (integer * i);
    }
</script>
</head>

<body>
<h1>Times Table</h1>

Please enter a positive integer: <input type="text" id="input">
<button type="button" onclick="computeTable()">Compute Table</button>
<hr>
<div id="outputdiv" style="font-weight:bold"></div>
</body>
</html>


时刻表
函数可计算（）{
//声明一些变量并从HTML表单中提取整数。这里没有什么可看的。
var integer=parseInt（document.getElementById（'input'）.value）；
var i=1；
//运行循环并完成所有算术运算
而（i<12）{
i++；
}
//此行显示给用户的输出
var output=document.getElementById（'outputdiv'）；
output.innerHTML=整数+“x”+i+“=”+（整数*i）；
}
时刻表
请输入一个正整数：
计算表
每次变量递增时，都需要更新div

var output = document.getElementById('outputdiv');
while (i < 12) {
    output.innerHTML = integer + " x " + i + " = " + (integer * i);
    i++;
}        

var output=document.getElementById（'outputdiv'）；
而（i<12）{
output.innerHTML=整数+“x”+i+“=”+（整数*i）；
i++；
}
虽然我认为它会很快更新您的结果，您可能无法看到每个结果。也许你想要这样的东西

var output = document.getElementById('outputdiv');
var html;
if (output.innerHTML.length != 0) {
    output.innerHTML = "";
}
while (i < 12) {
    html = output.innerHTML;
    html += (i > 1 ? ", " : "") + integer + " x " + i + " = " + (integer * i);
    output.innerHTML = html;
    i++;
}  

var output=document.getElementById（'outputdiv'）；
var-html；
if（output.innerHTML.length！=0）{
output.innerHTML=“”；
}
而（i<12）{
html=output.innerHTML；
html+=（i>1？，“：”）+整数+“x”+i+“=”+（整数*i）；
output.innerHTML=html；
i++；
}
这应该会给你一些类似于
result\u 1、result\u 2、result\u 3、//等的信息。

。另外，正如约翰内斯在他的回答和评论中指出的那样，可以直接更新innerHTML
output.innerHTML+=value
这里有多个问题

1） 你只输出一次，所以无论你做什么，只有一行。听起来很合理，对吧

2） 即使您多次输出，
output.innerHTML=“…”
也会覆盖以前的任何赋值因为这是一个赋值，它不会追加

因此，解决方案将附加到循环中：


var i = 1;
while ( i < 12 ) {
    output.innerHTML += integer + " x " + i + " = " + (integer * i) + "<br>";
    i++;
}



您可以直接附加到innerHTML，而不是阅读innerHTML、附加到innerHTML并写回它——请参阅我的答案。@JohannesH。我同意，更有效的是，我写它是为了更好地说明这个技巧。谢谢，谢谢，谢谢！我不知道事情这么简单！我会继续工作。总有一天我会像你们一样成为编程高手！这实际上只是一个练习的问题，所以我相信你会变得更好

for (var i = 1 ; i < 12 ; i++) {
    output.innerHTML += integer + " x " + i + " = " + (integer * i) + "<br>";    
}