写这个关键在于jQuery依赖的导入。
可以在jQuery官网把精简版的cdn核心保存到本地添加到项目路径中。
引用用 <script src="jquery-3.7.1.min.js"></script>.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<button id="reset">重新开始一局游戏</button><br/>
<span>请输入你要猜的数字：</span>
<input type="text" id="guessNum">
<button id="guess"> 猜</button><br/>
<span>已经猜的次数：</span><span id="count">0</span></br>
<span>结果：</span><span id="result"></span>
<script src="jquery-3.7.1.min.js"></script>
<script>
let count =0;
let number =Math.floor(Math.random()*100) +1;
console.log(number);
$("#guess").click(function(){
count++;
let guessNum =$("#guessNum").val();
$("#count").text(count);
if(number<guessNum){
$("#result").text("猜大了");
$("#result").css("color","red");
}else if(number>guessNum){
$("#result").text("猜小了");
$("#result").css("color","red");
}else{
$("#result").text("猜对了");
$("#result").css("color","green");
}
});
$("#reset").click(function(){
number =Math.floor(Math.random()*100) +1;
console.log(number);
count =0;
$("#result").text("");
$("#count").text(count);
$("#guessNum").val("");
});
</script>
</body>
</html>
.