前端

2023-09-18 11:21:50 +08:00
parent 8038f02f30
commit 85e41f3ef9
31 changed files with 1802 additions and 30 deletions
@@ -0,0 +1,47 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <meta name="author" content="flykhan" />
+    <meta name="keywords" content="c c++ 物联网" />
+    <title>猜一猜小游戏</title>
+    <style>
+      .ok {
+        color: green;
+        font-size: 25px;
+        font-family: "楷体";
+      }
+
+      .fail {
+        color: red;
+        font-size: 25px;
+        font-family: "仿宋";
+      }
+    </style>
+  </head>
+  <body>
+    <h3>请猜一下 1~10 的哪一个整数</h3>
+    <!-- input 的 onchange 表示输入数据之后回车，则调用的时间处理函数 -->
+    <input placeholder="建议大于10的整数" onchange="guest(this.value)" />
+    <div id="ret"></div>
+    <script>
+      // Math.random() 生成一个 0~1 之间的随机数 [0,1) 区间的小数
+      // Math.ceil() 上行取整
+      // Math.floor() 下行取整
+      var rand_n = parseInt(Math.random() * 10 + 1);
+      function guest(n) {
+        ret.innerText = "->" + n;
+        let input_n = parseInt(n);
+        if (input_n === rand_n) {
+          ret.innerHTML = "<span class='ok'> 恭喜您猜中了 </span>";
+        } else {
+          ret.innerHTML = "<span class='fail'> 加油，再猜一次试试</span>";
+        }
+
+        // 生成新的随机数
+        rand_n = parseInt(Math.random() * 10 + 1);
+        console.log("新的随机数:" + rand_n);
+      }
+    </script>
+  </body>
+</html>