1
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>计算器</title>
</head>
<body>
数1：<input type="text" id="num1"/><br>
数2：<input type="text" id="num2"/><br>
符号：
<select id="fh">
<option value="+">加</option>
<option value="-">减</option>
<option value="*">乘</option>
<option value="/">除</option>
</select>
<br>
<button onclick="jisuan()">计算</button>
<br>结果为：<input type="text" id="result" id="result"/>
<script>
//点击计算按钮时调用方法
//方法里面找元素 计算 赋值
function jisuan(){
var n1=+document.getElementById('num1').value,
n2=+document.getElementById('num2').value,
fh=document.getElementById('fh').value,
result=document.getElementById('result'),
jg=0;
if(fh=='+'){
jg=n1+n2;
}
if(fh=='-'){
jg=n1-n2;
}
if(fh=='*'){
jg=n1*n2;
}
if(fh=='/'){
jg=n1/n2;
}
result.value=jg;
}
</script>
</body>
</html>
2
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>eval计算器</title>
</head>
<body>
数1：<input type="text" id="num1"/><br>
数2：<input type="text" id="num2"/><br>
符号：
<select id="fh">
<option value="+">加</option>
<option value="-">减</option>
<option value="*">乘</option>
<option value="/">除</option>
</select>
<br>
<button onclick="jisuan()">计算</button>
<br>结果为：<input type="text" id="result" id="result"/>
<script>
function jisuan(){
var n1=+document.getElementById('num1').value,
n2=+document.getElementById('num2').value,
fh=document.getElementById('fh').value,
result=document.getElementById('result'),
jg=0;
jg=eval(n1+fh+n2); //接收一个字符串，根据上下文自动执行
result.value=jg;
}
</script>
</body>
</html>
eval() 函数：
接受一个字符串参数，将这个字符串作为代码在上下文环境中执行，并返回执行的结果
例：
var a=123;
alert(eval('a'));