Question

我希望有一个带按钮的页面，当我点击按钮时，应该显示文本。使用Javascript随机地从不同的数组中获取文本。除了一件事，一切都在我的项目中起作用：在页面的第一次加载时，我看到没有文本只是按钮。如何使其中一个数组随机选择并在第一页加载时显示（不点击按钮）

<!DOCTYPE html>
<html>

<head>
    <script>
        function myFunction() {
            var quotes = [{
                text: " <br>    1   <br><br>    2   <br><br>    3   ",
            }, {
                text: " <br>    4   <br><br>    5   <br><br>    6   ",
            }, {
                text: " <br>    7   <br><br>    8   <br><br>    9   ",
            }, ];
            var quote1 = quotes[Math.floor(Math.random() * quotes.length)];
            document.getElementById("quote1").innerHTML =
                '<p><font size="7">' + quote1.text + '</font></p>';
        }
    </script>
</head>

<body>
    <center>
        <div id="quote1"></div>
        <br>
        <br>
        <br>
        <br>
        <br>
        <center>
            <a href="#" onclick="myFunction()">Next</a>
        </center>
    </center>
</body>

</html>

谢谢！

Answer 1

在页面加载时调用它。

window.onload = function(){
   myFunction();
}

Answer 2

加载页面后调用该函数。

<body onload="myFunction()">

Answer 3

将所有内容放入doc末尾的函数中：

<!DOCTYPE html>
<html>
<head>

</head>

<body>
<center>
<div id="quote1"></div>
<br>
<br>
<br>
<br>
<br>
<center>
<a href="#" onclick="randomQuote()">Next</a>
</center>
</center>
</body>

<script>
var randomQuote = function() {
    var quotes = [
       {text:" <br>    1   <br><br>    2   <br><br>    3   ",},
       {text:" <br>    4   <br><br>    5   <br><br>    6   ",},
       {text:" <br>    7   <br><br>    8   <br><br>    9   ",},
     ];
     var quote1 = quotes[Math.floor(Math.random() * quotes.length)];
     document.getElementById("quote1").innerHTML=
          '<p><font size="7">' + quote1.text + '</font></p>';
 };
 randomQuote();

</script>
</html>

最后一行将立即执行该功能。

如何在不单击按钮的情况下随机显示数组？

3 个答案: