html5＋css＋jsp实现网页猜数游戏

最新推荐文章于 2024-03-01 19:10:41 发布

YTU-yx

最新推荐文章于 2024-03-01 19:10:41 发布

阅读量2.7k

点赞数 4

本文链接：https://blog.csdn.net/m0_46669582/article/details/121842731

版权

笔记专栏收录该内容

13 篇文章 3 订阅

订阅专栏

实验7 猜数游戏
实验目的
熟悉JavaScript基本语法应用
实验内容
根据下面的页面截图，使用Javascript完成猜数游戏。
实验要求
在这里插入图片描述

截图为浏览器运行界面截图。请设计html文件完成此功能，使用Javascript完成功能设计。

代码实现

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>猜数游戏</title>
    <style>
        h2 {
            color: red;
        }
        h1 {
            color: pink;
        }
    </style>
    <script>
        var target=parseInt(Math.random()*100);
        var count=10;
        var flag=false;
        function run() {
            if(flag) {
                var guess=document.getElementById("guess").value;
                var result=document.getElementById("feedback");
                var nn=document.getElementById("count");
                if(guess>target){
                    result.value="猜的有点大!";
                }else if(guess<target){
                    result.value="猜的有点小!";
                }else if(guess==target){
                    result.value="猜对啦！答案是"+guess;
                    flag=false;
                }
                count=count-1;
                nn.value=count;
            }
        }
        function Is() {
            flag=true;
        }
    </script>
</head>
<body align="center">
    <h2>猜数游戏</h2>
    <strong>请输入一个0-100之间的随机整数:</strong>
    <br/>
    <br/>
    <form>
        <input type="text" id="guess"/>
        <input type="button" id="button" value="提交" onclick="run()"/>
        <input type="button" value="开始" onclick="Is()"/><br/>
        <label>结果:<input type="text" id="feedback"/></label><br/>
        <label>当前还可以猜测的次数:<input type="text" value="10" id="count"/></label>
    </form>
</body>
</html>

执行截图
在这里插入图片描述

YTU-yx

关注

4
点赞
踩
10

收藏

觉得还不错? 一键收藏
0
评论
html5＋css＋jsp实现网页猜数游戏

实验7 猜数游戏实验目的熟悉JavaScript基本语法应用实验内容根据下面的页面截图，使用Javascript完成猜数游戏。实验要求截图为浏览器运行界面截图。请设计html文件完成此功能，使用Javascript完成功能设计。代码实现<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compati
复制链接

扫一扫