怎么用JavaScript制作猜谜游戏

发布时间:2022-02-23 11:34:28 作者:小新
来源:亿速云 阅读:105

这篇文章主要为大家展示了“怎么用JavaScript制作猜谜游戏”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“怎么用JavaScript制作猜谜游戏”这篇文章吧。

实例代码

<input type="text" placeholder="Your Guess" id="inputfield">
<button id="inputsubmit">Submit</button>
<!-- The results will be shown here -->
<div id="result"></div>
const inputfield = document.getElementById('inputfield')
const inputsubmit = document.getElementById('inputsubmit')
const result = document.getElementById('result')

const random = Math.floor(Math.random() * 10)

inputsubmit.addEventListener('click', () => {
    const inputvalue = inputfield.value
    const input = parseInt(inputvalue)
    if ( random === input ) {
        result.innerText = "Correct answer"
    } else {
        result.innerText = "Wrong answer"
    }
})

实现内容

在HTML中,只制作了一个用于猜测数字的输入字段(input),一个用于提交猜测的按钮(button)以及一个用来显示结果的div。

在JavaScript中,我们使用 getElementById 获取在 HTML 中所需要的这些内容。然后再通过 Math.random() 生成一个随机数,并将其乘以10(这是最大数字,你也可以将它改为任何你想要的数值。)

接着,我们再添加一个事件监听器,创建一个名为 inputvalue 的常量并在其中传递 inputfield.value,然后我们使用 parseInt 来获取 inputvalue 的整数值。在我们只使用 if 语句,所以如果随机 === 输入,那么我们将在结果 div 中写入“正确答案”,否则我们将在结果 div 中写入“错误答案”。

以上是“怎么用JavaScript制作猜谜游戏”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注亿速云行业资讯频道!

推荐阅读:
  1. JavaScript用200行代码制作打飞机小游戏实例
  2. Python Tkinter实现数字猜谜游戏的案例

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

javascript

上一篇:如何使用JavaScript实现二叉搜索树算法

下一篇:Javascript如何使用.call()和.apply()编写更好的代码

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》