正文
用js制作简易计算器及猜随机数字游戏
提示：扫一扫查出行【扫一扫了解最新限行尾号】
复制提示
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>JS简易计算器</title>
</head>
<style>
input[type="button"] {
height:55px; width:55px; background-image: -webkit-linear-gradient(90deg, lightskyblue, white);
}
</style><script type="text/javascript">
var result = "";
function calculator(num){ if(num=="="){
document.form1.text.value=eval(result); }else{
if(num=="reset"){
result="";
}
result = document.form1.text.value+num;
document.form1.text.value=result;
} }
</script><body style="text-align:center" >
<h3>简易计算器</h3>
<div class="box" style="margin: 0 620px;">
<form action="" class="form1" name="form1" >
<div class="header">
<input type="text" id="text" name="text" class="text"/>
<input id="reset" type="reset" value="清除" onclick="calculator(this.id)">
</div> <table class="table">
<tr>
<td> <input id="1" type="button" value="1" onClick="calculator(this.id)"/> </td>
<td> <input id="2" type="button" value="2" onClick="calculator(this.id)"/> </td>
<td> <input id="3" type="button" value="3" onClick="calculator(this.id)"/> </td>
<td> <input id="+" type="button" value="+" onClick="calculator(this.id)"/> </td>
</tr>
<tr>
<td> <input id="4" type="button" value="4" onClick="calculator(this.id)"/> </td>
<td> <input id="5" type="button" value="5" onClick="calculator(this.id)"/> </td>
<td> <input id="6" type="button" value="6" onClick="calculator(this.id)"/> </td>
<td> <input id="-" type="button" value="-" onClick="calculator(this.id)"/> </td>
</tr>
<tr>
<td> <input id="7" type="button" value="7" onClick="calculator(this.id)"/> </td>
<td> <input id="8" type="button" value="8" onClick="calculator(this.id)"/> </td>
<td> <input id="9" type="button" value="9" onClick="calculator(this.id)"/> </td>
<td> <input id="*" type="button" value="*" onClick="calculator(this.id)"/> </td>
</tr>
<tr>
<td> <input id="/" type="button" value="/" onClick="calculator(this.id)"/> </td>
<td> <input id="0" type="button" value="0" onClick="calculator(this.id)"/> </td>
<td> <input id="." type="button" value="." onClick="calculator(this.id)"/> </td>
<td> <input id="=" type="button" value="=" onClick="calculator(this.id)"/> </td>
</tr>
</table> </form>
</div></body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>猜数字</title> <script>
var num=Math.random()*99+1
function rnum(a){
if(a==parseInt(num)){
document.write("恭喜你猜对了")
}else if(a<num){
document.getElementById("divId").innerHTML="猜小了";
// $('#divId').html('猜小了');
}else if(a>num){
document.getElementById("divId").innerHTML="猜大了";
}
// alert(a)
//alert(parseInt(num))
} </script>
</head>
<body style="text-align: center">
<form name="form1">
<h3>猜数字</h3>
<input name="text" type="text" placeholder="请输入数字">
<input type="button" value="猜一下" onclick="rnum(document.form1.text.value)">
<div id="divId"></div>
<form action=""></body>
</html>
1、随机数中
document.write()
会直接跳转到新页面
于是我使用了
document.getElementById("divId").innerHTML="猜小了";
2、计算器中
document.form1.text.value=eval(result);
可以直接计算文本框里的内容3、计算器中var num=Math.random()*99+1
num值为小数，用parseInt(num)可以将num转化为1-100的整数方便比较
以上是我遇到的问题，希望对和我一样新手学习js有所帮助，谢谢！
