<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<style>
*{margin:2px;}
#text #inputText{ width:150px; height:40px; border:#06C 1px solid ;margin: 0 auto;}
#numValue { text-align: center; }
#cos {text-align: center;}
input{width:30px;height:30px;}

</style>
<body>
<div id="text">
<div id="inputText"></div>
<div id="cos"></div>
<div id="numValue"></div>
</div>
<script>
var arr=['1','2','3','+','4','5','6','-','7','8','9','*','0','00','=','/','AC'];
for(var i=0,str=[];i<17;i++){
if(i%4==3){
str.push("<input type='button' value='"+arr[i]+"'/>" + "</br>")
}
else{
str.push("<input type='button' value='"+arr[i]+"'/>")
}
}
var inputText = document.getElementById('inputText')
var numValue = document.getElementById('numValue')
numValue.innerHTML= str.join('')
for(var j=0;j<17;j++){
document.getElementsByTagName("input")[j].id=j;
document.getElementsByTagName("input")[j].onclick=function(){
if(this.id==14){
var cos = document.getElementById('cos')
cos.innerText = inputText.innerHTML+"="+eval(inputText.innerHTML)
inputText.innerText=eval(inputText.innerHTML)

}
else if(this.id==16){inputText.innerHTML=''}
else inputText.innerHTML+=this.value;
}}
</script>

</body>
</html>

js eval函数写一个简单的计算器的更多相关文章

  1. 用node.js从零开始去写一个简单的爬虫

    如果你不会Python语言,正好又是一个node.js小白,看完这篇文章之后,一定会觉得受益匪浅,感受到自己又新get到了一门技能,如何用node.js从零开始去写一个简单的爬虫,十分钟时间就能搞定, ...

  2. js eval()函数 接收一个字符串，做为js代码来执行。 如： s='var d="kaka"'; 或者s=‘function (code){return code }’;

    eval函数接收一个参数s,如果s不是字符串,则直接返回s.否则执行s语句.如果s语句执行结果是一个值,则返回此值,否则返回undefined. 需要特别注意的是对象声明语法“{}”并不能返回一个值, ...

  3. 用JavaScript写一个简单的计算器

    本文使用js实现了一个简单的加.减.乘.除计算器. 以下是css部分代码: *{ padding:0; margin:0; color: #424242; } .outer{ width:300px; ...

  4. 使用 js，自己写一个简单的滚动条

    当我们给元素加上 overflow: auto;  的时候,就会出现滚动条,然而浏览的不同,滚动条的样式大不一样,有些甚至非常丑. 于是就想着自己写一个滚动条,大概需要弄清楚一下这几个点: 1.滚动条 ...

  5. js钩子函数实现一个简单动画

    <!DOCTYPE html> <html> <head> <title></title> <meta charset="u ...

  6. 用c++写一个简单的计算器程序

    // 050305.cpp : 定义控制台应用程序的入口点.// // 050304.cpp : 定义控制台应用程序的入口点.////四则运算#include "stdafx.h" ...

  7. 用python语言写一个简单的计算器

    假如我们有这样一个式子: 1 - 2 * ( (60-30 +(-40/5) * (9-2*5/3 + 7 /3*99/4*2998 +10 * 568/14 )) - (-4*3)/ (16-3*2 ...

  8. 第一个Three.js程序——动手写一个简单的场景

    三维场景基本要素: 步骤: 代码: 源码: <!DOCTYPE html> <html lang="en"> <head> <meta c ...

  9. 原生js 基于canvas写一个简单的前端 截图工具

    先看效果 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <titl ...

随机推荐

  1. js 声明提升

    声明提前变量在声明之前已经可以使用了 js中的所有的变量声明都提升到函数体内的顶部 ,如下图 实际运行的情况是如下 function f1() {-- var scope ; console.log( ...

  2. <经验杂谈>介绍Js简单的递归排列组合

    最近在开发SKU模块的时候,遇到这样一个需求,某种商品有N(用未知数N来表示是因为规格的数组由用户制定且随时可以编辑的,所以对程序来说,它是一个未知数)类规格,每一类规格又有M个规格值,各种规格值的组 ...

  3. Access数据库自动生成设计文档

    在做Access数据库设计时,常常直接在access文件中建表,建字段,然后写设计文档时,又得重新再写一遍字段和表间关系.其实access数据库自己就支持自动生成数据库文档. 操作方法如下: 数据库工 ...

  4. Java课程设计报告——购物车

    1.码云GIT提交 Git地址 2基本框架 3.基本界面 1.主界面: 2.购物车界面: 3.添加商品界面: 4.删除商品界面: 5.修改商品界面: 6.商城界面: 7.购物车显示界面: 4.代码解释 ...

  5. JDBC操作数据库的三种方式比较

    JDBC(java Database Connectivity)java数据库连接,是一种用于执行上sql语句的javaAPI,可以为多种关系型数据库提供统一访问接口.我们项目中经常用到的MySQL. ...

  6. 从PRISM开始学WPF（四）Prism-Module？

    从PRISM开始学WPF(一)WPF? 从PRISM开始学WPF(二)Prism? 从PRISM开始学WPF(三)Prism-Region? 从PRISM开始学WPF(四)Prism-Module? ...

  7. OO第一次总结

    第一次作业: 第一次作业的指导书发下来之后我按着上面的步骤一步一步的做了之后发现项目拉下来了,怎么开始码代码呢...然后在舍友的帮助下才知道怎么建包建类,然后对Java的语法又不是很了解,于是就先把C ...

  8. New UWP Community Toolkit - RotatorTile

    概述 UWP Community Toolkit  中有一个为图片或磁贴提供轮播效果的控件 - RotatorTile,本篇我们结合代码详细讲解  RotatorTile 的实现. RotatorTi ...

  9. 前端基础之html-Day12

    1.web服务本质 import socket def main(): sock = socket.socket(socket.AF_INET, socket.SOCK_STREAM) sock.bi ...

  10. 其他—cooki和session

    cookie Cookie的由来 大家都知道HTTP协议是无状态的. 无状态的意思是每次请求都是独立的,它的执行情况和结果与前面的请求和之后的请求都无直接关系,它不会受前面的请求响应情况直接影响,也不 ...