Question

此代码无法正常工作，但我不确定是否存在问题。

的代码：

<body>
  var randNumForQuote = Math.floor((Math.random() * 11));

  if (randNumForQuote == 0) {
    document.getElementById("quoteDiv").innerHTML = "Hello";
  } else if (randNumForQuote == 1) {
    document.getElementById("quoteDiv").innerHTML = "Hello1";
  } else if (randNumForQuote == 2) {
    document.getElementById("quoteDiv").innerHTML = "Hello2";
  } else if (randNumForQuote == 3) {
    document.getElementById("quoteDiv").innerHTML = "Hello3";
  } else if (randNumForQuote == 4) {
    document.getElementById("quoteDiv").innerHTML = "Hello4";
  } else if (randNumForQuote == 5) {
    document.getElementById("quoteDiv").innerHTML = "Hello5";
  } else if (randNumForQuote == 6) {
    document.getElementById("quoteDiv").innerHTML = "Hello6";
  } else if (randNumForQuote == 7) {
    document.getElementById("quoteDiv").innerHTML = "Hello7";
  } else if (randNumForQuote == 8) {
    document.getElementById("quoteDiv").innerHTML = "Hello8";
  } else if (randNumForQuote == 9) {
    document.getElementById("quoteDiv").innerHTML = "Hello9";
  } else if (randNumForQuote == 10) {
    document.getElementById("quoteDiv").innerHTML = "Hello10";
  }

  <div id="quoteDiv"></div>
</body>

我在JavaScript方面的经验有限，所以不太了解这个问题。

我期待div说出其中一个输出（例如Hello, Hello1, Hello2, etc.）

Answer 1

您需要将JavaScript代码放在script标记内并在加载页面后运行代码，然后放入 window.onload 回调中，该回调会在文档末尾触发加载过程。

<body>
  <script>
    window.onload = function() {
      var randNumForQuote = Math.floor((Math.random() * 11));

      if (randNumForQuote == 0) {
        document.getElementById("quoteDiv").innerHTML = "Hello";
      } else if (randNumForQuote == 1) {
        document.getElementById("quoteDiv").innerHTML = "Hello1";
      } else if (randNumForQuote == 2) {
        document.getElementById("quoteDiv").innerHTML = "Hello2";
      } else if (randNumForQuote == 3) {
        document.getElementById("quoteDiv").innerHTML = "Hello3";
      } else if (randNumForQuote == 4) {
        document.getElementById("quoteDiv").innerHTML = "Hello4";
      } else if (randNumForQuote == 5) {
        document.getElementById("quoteDiv").innerHTML = "Hello5";
      } else if (randNumForQuote == 6) {
        document.getElementById("quoteDiv").innerHTML = "Hello6";
      } else if (randNumForQuote == 7) {
        document.getElementById("quoteDiv").innerHTML = "Hello7";
      } else if (randNumForQuote == 8) {
        document.getElementById("quoteDiv").innerHTML = "Hello8";
      } else if (randNumForQuote == 9) {
        document.getElementById("quoteDiv").innerHTML = "Hello9";
      } else if (randNumForQuote == 10) {
        document.getElementById("quoteDiv").innerHTML = "Hello10";
      }
    }
  </script>

  <div id="quoteDiv"></div>
</body>

虽然你可以减少代码

<body>
  <script>
    window.onload = function() {
      var randNumForQuote = Math.floor((Math.random() * 11));
      document.getElementById("quoteDiv").innerHTML = "Hello" + (randNumForQuote ? " " + randNumForQuote : '');
    }
  </script>

  <div id="quoteDiv"></div>
</body>

Answer 2

Javascript需要在脚本标记中，如果它在html中，并且您需要在脚本标记之前使用div。

<body>
  <div id="quoteDiv"></div>
<script>
  var randNumForQuote = Math.floor((Math.random() * 11));

  if (randNumForQuote == 0) {
    document.getElementById("quoteDiv").innerHTML = "Hello";
  } else if (randNumForQuote == 1) {
    document.getElementById("quoteDiv").innerHTML = "Hello1";
  } else if (randNumForQuote == 2) {
    document.getElementById("quoteDiv").innerHTML = "Hello2";
  } else if (randNumForQuote == 3) {
    document.getElementById("quoteDiv").innerHTML = "Hello3";
  } else if (randNumForQuote == 4) {
    document.getElementById("quoteDiv").innerHTML = "Hello4";
  } else if (randNumForQuote == 5) {
    document.getElementById("quoteDiv").innerHTML = "Hello5";
  } else if (randNumForQuote == 6) {
    document.getElementById("quoteDiv").innerHTML = "Hello6";
  } else if (randNumForQuote == 7) {
    document.getElementById("quoteDiv").innerHTML = "Hello7";
  } else if (randNumForQuote == 8) {
    document.getElementById("quoteDiv").innerHTML = "Hello8";
  } else if (randNumForQuote == 9) {
    document.getElementById("quoteDiv").innerHTML = "Hello9";
  } else if (randNumForQuote == 10) {
    document.getElementById("quoteDiv").innerHTML = "Hello10";
  }
</script>
</body>

Answer 3

<html>
<body> 
    <div id="quoteDiv"></div>



</body>
<script>
// self executing function here

   var randNumForQuote = Math.floor((Math.random() * 11));

  if (randNumForQuote == 0) {
    document.getElementById("quoteDiv").innerHTML = "Hello";
  } else if (randNumForQuote == 1) {
    document.getElementById("quoteDiv").innerHTML = "Hello1";
  } else if (randNumForQuote == 2) {
    document.getElementById("quoteDiv").innerHTML = "Hello2";
  } else if (randNumForQuote == 3) {
    document.getElementById("quoteDiv").innerHTML = "Hello3";
  } else if (randNumForQuote == 4) {
    document.getElementById("quoteDiv").innerHTML = "Hello4";
  } else if (randNumForQuote == 5) {
    document.getElementById("quoteDiv").innerHTML = "Hello5";
  } else if (randNumForQuote == 6) {
    document.getElementById("quoteDiv").innerHTML = "Hello6";
  } else if (randNumForQuote == 7) {
    document.getElementById("quoteDiv").innerHTML = "Hello7";
  } else if (randNumForQuote == 8) {
    document.getElementById("quoteDiv").innerHTML = "Hello8";
  } else if (randNumForQuote == 9) {
    document.getElementById("quoteDiv").innerHTML = "Hello9";
  } else if (randNumForQuote == 10) {
    document.getElementById("quoteDiv").innerHTML = "Hello10";
  }
</script>

</html>

此JavaScript代码无效。我的语法错了还是别的？

3 个答案: