js中关于eval（）方法，写了一个计算器小例子

有的时候获取到的数值是 string 类型可以转换为number 但有时会得到string类型的表达式，然后发现了eval（）这个函数很方便啊

===================================================

引用

定义和用法

eval() 函数计算 JavaScript 字符串，并把它作为脚本代码来执行。

如果参数是一个表达式，eval() 函数将执行表达式。如果参数是Javascript语句，eval()将执行 Javascript 语句。

实例

执行JavaScript代码或表达式:

    <script> 
   
eval("x=10;y=20;document.write(x*y)"); 
   
document.write("<br>" + eval("2+2")); 
   
document.write("<br>" + eval(x+17)); 
   
</script>

==============================================================================

写了一个计算器用了用eval（）获取显示的表达式计算结果

<!DOCTYPE html>
<html>
<head>
	<title></title>
	<style type="text/css">
		#box{
			width: 406px;
			height: 500px;
			border: 1px solid black;
			margin: 50px auto;

		}
		#screen{
			width: 100%;
			height: 100px;
			
			font: 20px ;
			text-align: right ;
			/*overflow: hidden;*/
		}
		#top,#bottom {
			width: 100%;
			height: 49px;
			border-bottom: 1px solid black;
			float: left;
		}
		#number{
			width: 306px;
			float: left;
		}
		
		#mark{
			width: 100px;
			/*height: 00px;*/
			
			float: left;
		}
		
		#number div{
			width: 100px;
			height: 100px;
			border: 1px solid black;
			float: left;
		}
		#mark div{
			height: 100px;
			border: 1px solid black;
		}
		.center {
			text-align: center;
			font: 20px/100px 'simhei';
		}
	</style>
</head>
<body>
	<div id="box">
		<div id="screen">
			<div id="top"></div>
			<div id="bottom"></div>	
		</div>
		<div id="number" class="center">
			<div value='1'>1</div>
			<div value='2'>2</div>
			<div value='3'>3</div>
			<div value='4'>4</div>
			<div value='5'>5</div>
			<div value='6'>6</div>
			<div value='7'>7</div>
			<div value='8'>8</div>
			<div value='9'>9</div>
		</div>
		<div id="mark" class="center">
			<div value='+'>+</div>
			<div value='-'>-</div>
			<div value='='>=</div>
		</div>
	</div>

	<script type="text/javascript">
		var num = document.getElementById('number');
		var	number = num.getElementsByTagName('div');
		var mark = document.getElementById('mark').getElementsByTagName('div');
		var screen = document.getElementById('screen');
		var top1 = document.getElementById('top');
		var bottom = document.getElementById('bottom');
	
	
		addClick(number);
		addClick(mark);


		function addClick(obj) {
			for (var i = 0; i < obj.length; i++) {
			 	obj[i].onclick = function () {
			 	
			 		if (this.innerHTML== '=') {
			 			// 点击 = 获得下半个屏幕显示的字符串 如'9+9'
			 			var str = bottom.innerHTML;
			 			// eval（）计算字符串表达式的值
			 			var result = eval(str);
						// 将表达式 显示在上半屏幕	 	
						// top.innerHTML = str;		
			 			top1.innerHTML = bottom.innerHTML + '=';
			 			//清空后只显示结果
			 			bottom.innerHTML = result;
			 		}else{
			 			//点击数字 拼接
			 			bottom.innerHTML += this.innerHTML;
			 		}
			 		
			 	}
		 	 }
		 	// alert(number[i].getAttribute('value')); 
		}
		function pro() {
			// body...
		}

	</script>
</body>
</html>

js中关于eval（）方法，写了一个计算器小例子

定义和用法

实例

猜你喜欢