练习-计算器

<!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>

<!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'));