要求如下

逻辑如下：

  1. 一个button按钮
  2. 第二行中，打印“请…数字”
    然后一个 输入文本框
    然后一个 按钮
  3. 第三行 打印 “已经猜的次数”
    然后打印 猜的次数
  4. 结果显示 猜大了 猜小了 猜对了

在script中

  1. 获取button按钮、输入的数据、记录count的值，以及结果值
  2. 随机生成一个 随机数Math.floor 、 count变量值记录
  3. 如果点 猜按钮，所有数据进行变动
  4. 如果点 重启，所有数据初始化
<!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>Document</title></head><body><button type="button" id="reset">重新开始一局游戏</button><br>请输入要猜的数字：<input type="text" id="number"><button type="button" id="button">猜</button><br>已经猜的次数：<span id="count">0</span><br>结果：<span id="result"></span><script>var inputE = document.querySelector("#number"); var countE = document.querySelector("#count");var resultE = document.querySelector("#result");var btn = document.querySelector("#button");var resetBtn = document.querySelector("#reset");// 随机生成一个 1-100 的数字var guessNumber = Math.floor(Math.random() * 100) + 1// 0 - 1 之间的数var count = 0;// on: 当// click: 点击// 事件驱动（Event-Drive）：只要真正发生了点击事件时，才执行该函数btn.onclick = function() {count++;countE.innerText = count;var userGuess = parseInt(inputE.value);if (userGuess == guessNumber) {resultE.innerText = "猜对了";resultE.style = "color: gray;"; } else if (userGuess < guessNumber) {resultE.innerText = "猜小了";resultE.style = "color: blue;"; } else {resultE.innerText = "猜大了";resultE.style = "color: red;"; } };resetBtn.onclick = function() {guessNumber = Math.floor(Math.random() * 100) + 1count = 0;countE.innerText = count;resultE.innerText = "";inputE.value = ""; }</script></body></html>