先附code:
<html>
<head>
<title></title>
<script language="javascript">
var k = 0;
var randomValue=parseInt(100*(Math.random()));
function textDisable()
{
document.getElementById("number").disabled=true;
}
function getRandomValue()
{
document.getElementById("randomValue").value=randomValue;
}
function getValue()
{
var textValue=document.getElementById("number").value;
if(!check(textValue,randomValue))
{
k++;
document.getElementById("times").value=k.toString();
if(k==5)
{
textDisable();
}
}
else
{
textDisable();
}
}
function check(textValue,randomValue)
{
var flag=false;
var tempResult="";
if(textValue>randomValue)
{
document.getElementById("compareResult").innerHTML="the value is larger than random value!";
}
else if(textValue==randomValue)
{
flag=true;
document.getElementById("compareResult").innerHTML="the value is equals with random value,congratulations!";
}
else
{
document.getElementById("compareResult").innerHTML="the value is smaller than random value!";
}
return flag;
}
function rePlay()
{
//对于disabled的赋值让我很狂晕,用disabled值无法动态赋值
document.getElementById("number").disabled=false;
document.getElementById("number").value="";
document.getElementById("randomValue").value="";
document.getElementById("times").value="";
}
</script>
<style type="text/css">
body{ text-align : center ; padding : 0px ; margin : 0px ; color : #36f ;}
.spanWidth{margin:0px 20px;}
.bottomline{ border : solid 0px #fff ; border-bottom : solid 1px #000 ; width : 3em ; text-align : center ;}
</style>
</head>
<body>
<div id="container">
<h2>猜数字游戏</h2>
<p>系统随机产生一个介于0-99的数字，玩家有五次机会玩乐。</p>
<p>请玩家输入数字：<input type="text" id="number" class="bottomline"><span class="spanWidth"></span>
<input width="20px" type="button" onClick="getValue()" value="O K" />
</p>
<p>比较输入值与随机值：<span id="compareResult"></span></p>
<p>游戏玩家次数：<input type="text" id="times" class="bottomline"/></p>
<p>随机数：<input type="text" id="randomValue" class="bottomline" readonly="readonly"/>
<span class="spanWidth"></span>
<input type="button" value="查看随机数" onclick="getRandomValue()" />
</p>
<p><input type="button" id="rePlay" onclick="rePlay()" value="重玩"></p>
</div>
</body>
</html>
刚开始接触js脚本，做了一个简单的小程序，却用了一天的时间，让我很惊讶，原来自己真的很菜啊！
下面就说说这个程序我所遇到的坎儿，算法倒是没什么，就是语法！
1.知道js是弱类型语言，数据类型都为var声明，可由于其他编程语言的习惯，k就顺手写成int型，查了好久才发现啊
2.button按钮单击没效果，原来是写好的函数没调用，也让我无语
3.innerText对于不同浏览器的显示问题
4.document.getElementById("number").disabled=false;我加过注释的，这个让我花的时间最多，在文本框中设置的是属性值为"disabled"，却不知与之相反的可用值。还有就是disabled的属性值True,False是否加“”，我也调试了好久。
分享到：
相关推荐
在本文中，我们将探讨如何使用JavaScript实现一个简单的猜数字游戏。 首先，我们要理解游戏的基本规则：生成一个0到100之间的随机整数，让用户尝试猜测，根据用户的输入给出提示，直到用户猜中为止。为了实现这个...
### Java猜数字游戏知识点 #### 一、项目概述 本项目是使用Java语言...综上所述，无论是Java还是JavaScript版本的猜数字游戏，其核心逻辑都是类似的，主要涉及随机数生成、输入验证、结果计算以及用户交互等环节。
【标题】"通过jsp+javabean实现猜数字游戏"涉及的是Web开发中的经典技术组合，主要用于构建动态交互式的Web应用程序。在这个项目中，开发者利用JavaServer Pages (JSP) 和 JavaBeans 技术来创建一个用户参与的猜数字...
3.js控制生成的随机数与输入的数字比较 4.根据相比的结果提示并显示相应的图片 5.猜测次数默认是6次，6次没有猜中则为游戏挑战失败，点击重新开始按钮可重新开始 6.6次中有一次猜中则为胜利，猜中后不论还剩几次都将...
以上就是使用jQuery实现猜数字游戏的基本步骤。通过这个游戏，你可以练习jQuery的选择器、事件处理、DOM操作以及基本的JavaScript逻辑。在实际开发中，你还可以考虑增加更多的功能，比如限制猜测次数、显示剩余次数...
内容概要：这篇文章详细地指导读者使用前端框架 Vue.js 结合 Vite 构建工具搭建起一个简洁的猜数字小游戏。从环境的配置到项目的初始化再到界面布局和核心功能的编码都进行了详细的描述，尤其是针对如何使用 Vite ...
**JSP界面设计--猜数字游戏** 在IT领域，JSP（JavaServer Pages）是一种用于创建动态网页的技术，它结合了HTML和Java代码，使得开发者能够构建交互式的Web应用程序。本项目是一个基于JSP的猜数字游戏，它提供了一个...
在这个“猜数字小游戏”中，我们将探讨如何利用HTML结合JavaScript来构建一个互动的在线游戏。首先，我们从基础开始，了解HTML的结构和元素。 HTML文档通常由头部（`<head>`）和主体（`<body>`）两部分组成。头部...
在这个“微信小程序——猜数字游戏”项目中，我们将会探讨微信小程序开发的一些核心技术和实现策略。 首先，我们要了解小程序的基本结构。微信小程序由多个页面构成，每个页面包括wxml（结构层）和wxss（样式层）...
【猜数字游戏-Servlet练习】是一个适合初学者的项目，旨在帮助学习者深入理解Servlet技术。Servlet是Java Web开发中的核心组件，它扩展了Web服务器的功能，允许我们编写动态、交互式的网页应用。在这个练习中，我们...
在本文中，我们将深入探讨如何使用JavaScript实现一个简单的弹窗猜数字游戏。 首先，游戏的核心在于生成一个随机数和用户猜测的过程。在提供的代码片段中，随机数的生成是通过`Math.random()`函数完成的，这个函数...
本资源是一个HTML脚本文件，主要使用JavaScript语言编写，旨在实现一个猜数字游戏。下面是该资源的知识点摘要： 一、HTML基本结构 * DOCTYPE声明：`<! DOCTYPE ...
**Python Flask 猜数字游戏详解** 在编程领域，创建互动性强、有趣味性的应用程序是一种提升技能和理解Web开发的好方法。"Python Flask 猜数字游戏"就是一个很好的实例，它结合了Python语言的简洁性与Flask框架的...
JS和html实现的猜数字小游戏实现码中的JavaScript部分主要是通过两个函数guessNumber()和newGame()来实现猜数字游戏的功能。 当玩家输入数字，点击“猜一下”按钮或按下回车键时，guessNumber()函数会被调用。在该...
【标题】"用C语言编写的猜数字游戏"是一个经典的编程练习项目，它涉及到了C语言的基本语法、随机数生成、循环控制结构以及条件判断等多个关键知识点。这个游戏的核心是计算机生成一个四位数字，然后让用户尝试猜测这...
【Ajax实现的猜数游戏】是一个基于Web技术的互动应用，它利用了JavaServer Pages (JSP)、Servlet以及Ajax（Asynchronous JavaScript and XML）技术。在这个游戏中，服务器随机生成一个数字，用户在客户端进行猜测，...
基于Vue组件实现猜数字游戏是指使用Vue.js框架来构建一个猜数字游戏的组件。该游戏的主要功能是让用户输入一个数字，然后判断用户输入的数字是否正确。如果用户输入的数字太小或太大，游戏将显示相应的提示信息，...