FizzBuzz 在使用 getElementById.innerHTML 时返回随机数

Question

希望有人能帮助我。我对编码和学习编写我的第一个 fizzbuzz 非常陌生。当我使用 console.log 执行代码时，我的代码有效，但是当我尝试使用 getElementById.innerHTML 时，它想要返回随机数。

这是我正在处理的内容：

function clickAlert2() {
  for (var i = 1; i <= 140; i++) {
    if (i % 3 === 0 && i % 5 === 0) {
      document.getElementById("ngList").innerHTML +=
        i + ". National Gamers <br>";
    } else if (i % 3 === 0) {
      document.getElementById("ngList").innerHTML += i + ". National <br>";
    } else if (i % 5 === 0) {
      document.getElementById("ngList").innerHTML += i + ". Gamers <br>";
    } else {
      document.getElementById("ngList").innerHTML += i;
    }
  }
}

  .button2 {
  background-color: #FAD7A0;
  color: #21618C;
  text-align: center;
  text-decoration: none;
  font-size: 18px;

<input type="button" class="button2" value="Print 140 Lines" onclick="clickAlert2()">
<br>
<div id="ngList"></div>

我认为这只是一些小事，但我不知道它可能是什么...

Answer 1

您的代码没有返回随机值，而是不能被 3 或 5（或两者）整除的 i 值没有在 [=28] 中收到 <br> 换行符=].如果您将 <br> 添加到 else 案例，您的输入将如您所愿。

function clickAlert2() {
    for (var i=1; i <= 140; i++) {
        if (i % 3 === 0 && i % 5 === 0) {
            document.getElementById("ngList").innerHTML +=
                i + ". National Gamers <br>";
        }
        else if (i % 3 === 0) {
            document.getElementById("ngList").innerHTML += i + ". National <br>";
        }
        else if (i % 5 === 0) {
            document.getElementById("ngList").innerHTML += i + ". Gamers <br>";
        }
        else {
            document.getElementById("ngList").innerHTML += i + "<br>";
        }
    }
}

.button2 {
    background-color: #FAD7A0;
    color: #21618C;
    text-align: center;
    text-decoration: none;
    font-size: 18px;

<input type="button" class="button2" value="Print 140 Lines" onclick="clickAlert2()">
<br>
<div id="ngList"></div>

请注意是否要打印不匹配的行。如果不这样做，则应完全删除 else 条件。

Answer 2

您忘记在 else 中添加分隔符，因此它在同一行打印数字。第一行是 123，不是随机数，而是一行的前三个数字。

function clickAlert2() {
  var element = document.getElementById("ngList");

  for (var i = 1; i <= 140; i++) {
    if (i % 3 === 0 && i % 5 === 0) {
      element.innerHTML += i + ". National Gamers";
    } else if (i % 3 === 0) {
      element.innerHTML += i + ". National";
    } else if (i % 5 === 0) {
      element.innerHTML += i + ". Gamers";
    } else {
      element.innerHTML += i;
    }
    element.innerHTML += "<br>";
  }
}

  .button2 {
  background-color: #FAD7A0;
  color: #21618C;
  text-align: center;
  text-decoration: none;
  font-size: 18px;

<input type="button" class="button2" value="Print 140 Lines" onclick="clickAlert2()">
<br>
<div id="ngList"></div>

FizzBuzz 在使用 getElementById.innerHTML 时返回随机数

FizzBuzz giving back random numbers when using getElementById.innerHTML

function

if-statement

getelementbyid

fizzbuzz

FizzBu​​zz 在使用 getElementById.innerHTML 时返回随机数

FizzBuzz giving back random numbers when using getElementById.innerHTML

function

if-statement

getelementbyid

fizzbuzz

FizzBuzz 在使用 getElementById.innerHTML 时返回随机数