很久以前写了个猜数字游戏，原理就是用js生成一个随机数，然后用户输入一个数字去与这个随机书进行比较是否相等。代码如下
https://github.com/hyz1997/numberRiddle/blob/master/index.html
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>猜数字游戏</title>
<style type="text/css">
.main {
position: relative;
left: 500px;
top: 200px;
400px;
height: 400px;
background: lightgreen;
border-radius: 50%;
}
.main p {
display: block;
position: relative;
left: 110px;
top: 150px;
font-size: 24px;
font-family: "方正喵呜体";
color: green;
}
#text {
display: block;
position: relative;
left: 122px;
top: 180px;
padding-left: 45px;
80px;
height: 80px;
border: 3px yellow solid;
border-radius: 40%;
background: lightgreen;
}
#button {
position: relative;
top: 210px;
left: 170px;
}
</style>
</head>
<body>
<div class="main">
<p>猜一个数字吧</p>
<input type="text" id="text" value="">
<input type="button" id="button" value="提交">
</div>
<script type="text/javascript">
var num = Math.floor(Math.random()*1000+1);
var patt = /^(?!00)(?:[0-9]{1,3}|1000)$/;
var rendom ="1-1000";
var id = "text";
console.log("哈哈你很聪明哟，知道打开控制台，要猜的数字是"+num);
function numberRiddle () {
var text = parseInt(document.getElementById(id).value);
if (num == ''||patt.test(text)==false) {
alert("请输入"+rendom+"的数字");
}
else {
if (num>text) {
alert("你猜小了，大胆一点吧");
}else if(num<text) {
alert("你猜大了，人家很腼腆的");
}else {
alert("你猜对了，不过没什么奖励");
}
}
}
window.onload = function() {
document.getElementsByTagName('input')[1].addEventListener("click",numberRiddle,false);
}
</script>
</body>
</html>
近日准备整理文件上传github，又重写了这个游戏，然后发现几个问题。
首先我们要对用户输入的值进行判断，首先要判断它是不是数值。
判断数值的方法有很多，我首先想到了typeof方法
我是这样写的
var text = document.getElementById('text').value;
console.log(typeof(text))
然后报错：typeof is not a function。后来我查到，typeof是一个操作符而不是函数，因此圆括号尽管可以使用，但不是必须的。
然后我又想到先把text的值praseInt成数值类型
var text = parseInt(document.getElementById('text').value);
//如果text的值是字符串
console.log(text);//NaN
那我想就可以这样了
if (num == ''||test==NaN) {
alert("请输入"+rendom+"的数字");
}
但事实是NaN是一个非数值，不与任何值相等。
最后我选择了用正则表达式来判断的方法，十分简单，这里就不讲了。
写这篇问主要是为了记录遗忘的两个javascript基础知识点，然后我在去看了一遍高程的第三章，每一次看高程，都有不一样的新发现。关于新发现，我已经记录在文章javaScript基础概念小知识点集中，您可以阅读并提出建议