这是一个简易计算器的脚本,从简易这个词就可以看出这个代码很简陋,很简陋!
代码如下
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8"/>
<title>first javascript demo</title>
</head>
<body>
<p onclick="hello()">
hello world
</p>
<div id="calculator">
<form action="" onsubmit="return operatorResult()">
<input type="text" id="firstNumber" name="first" value="input a number"/>
<select name="operator" id="operator">
<option value="plus">+</option>
<option value="minus">-</option>
<option value="multiply">*</option>
<option value="divide">/</option>
<option value="complementation">%</option>
</select>
<input type="text" id="secondNumber" name="second" value="input a number"/>
<input type="submit" value="result" />
</form>
</div>
</body>
<script>
function hello() {
alert("hello world");
}
function operatorResult() {
var x = document.getElementById("firstNumber").value;
var y = document.getElementById("secondNumber").value;
var operator = document.getElementById("operator").value;
if(isNum(x) && isNum(y)) {
var x = Number(x);
var y = Number(y);
switch(operator) {
case "plus":
var z = x + y;
break;
case "minus":
var z = x - y;
break;
case "multiply":
var z = x * y;
break;
case "divide":
var z = x / y;
break;
case "complementation":
var z = x % y;
break;
default:
document.write("input error!");
}
alert(z);
} else {
alert("please input a number!");
}
}
function isNum(s) {
if(s != null && s != "") {
return !isNaN(s);
}
return false;
}
</script>
</html>
用到的函数有
| isNaN() | 函数用于检查其参数是否是非数字值。 如果 x 是特殊的非数字值 NaN(或者能被转换为这样的值),返回的值就是 true。如果 x 是其他值,则返回 false。(试了好多次才发现是非数字时返回true) 说明isNaN() 函数可用于判断其参数是否是 NaN,该值表示一个非法的数字(比如被 0 除后得到的结果)。 如果把 NaN 与任何值(包括其自身)相比得到的结果均是 false,所以要判断某个值是否是 NaN,不能使用 == 或 === 运算符。正因为如此,isNaN() 函数是必需的。 |
| Number() | 把对象的值转换为数字。 返回值如果参数是 Date 对象,Number() 返回从 1970 年 1 月 1 日至今的毫秒数。 如果对象的值无法转换为数字,那么 Number() 函数返回 NaN。 |