通过单击按钮javascript显示两个图像中的一个(50次50次机会掷硬币)

Displaying one of two image (50 50 chance-coin toss) from a click button-javascript

本文关键字:50次 硬币 一个 机会 两个 显示 javascript 按钮 单击 图像      更新时间:2023-09-26

我正试图使用随机数生成器,通过将每个图像分配给if and else语句,使用单击按钮显示两个图像中的一个。我不确定问题出在哪里。以下是我的:

 <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
        <title>Assignment 9</title> 
        <link href="images/avatar.png" rel="shortcut icon" type="image/png">
        <link href="css/stylesheet.css" rel="stylesheet" type="text/css">
        <script src="js/javascript.js" type="text/javascript"></script>
        <style type="text/css">
        .auto-style1 {
            text-align: center;
        }
        </style>
        <script type="text/javascript">
        </script>
    </head>
    <body>
    <header>
    </header>
    <aside>
    </aside>
    <div id="main">
    <h1> Arrays and Coditional Statements</h1>
<h2 class="auto-style1">Flip a coin </h2>

<script>
  function myFunction1() {
    var result = doucment.getElementById("pic");
    var x = Math.floor(Math.random() * 2);
    console.log(x);
    if (x == 0) {
      document.getElementById("Coin").innerHTML = "Heads"
 result.innerHTML="<img alt='"the frontside of a coin'" src='"images/heads.jpg'" />";  }
  else {
      document.getElementById("Coin").innerHTML = "Tails";
      result.innerHTML= "<img alt='"the backside of a coin'" src='"images/tails.jpg'" />";
    }
  }
  myFunction1();
</script>
<button type="button" onclick="myFunction1()" id="Coin">CLick ME</button>
<p id="pic"> </p>



</div>
<footer>
</footer>
</body>
</html>

您有一个非常简单的打字错误。您写道:
var result = doucment.getElementById("pic");
文档拼写错误