<!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. python全栈开发-Day11 迭代器、生成器、面向过程编程

    一. 迭代器 一 .迭代的概念 迭代器即迭代的工具,那什么是迭代呢? 迭代是一个重复的过程,每次重复即一次迭代,并且每次迭代的结果都是下一次迭代的初始值 while True: #只是单纯地重复,因而 ...

  2. 关于Netty的入门使用

    Netty介绍: Netty是一个提供异步事件驱动的网络应用框架,用以快速开发高性能.高可靠性的网络服务器和客户端程序. 换句话说,Netty是一个NIO框架,使用它可以简单快速地开发网络应用程序,比 ...

  3. CodeBlocks使用介绍

    CodeBlocks对单个文件没法调试,需要建工程后才能调试,所以使用CodeBlocks必须先建工程. 一.如何用CodeBlocks建工程文件. 选择File->New->Projec ...

  4. 敏捷冲刺每日报告--day2

      1 团队介绍 团队组成: PM:齐爽爽(258) 小组成员:马帅(248),何健(267),蔡凯峰(285)  Git链接:https://github.com/WHUSE2017/C-team ...

  5. 面试必问---HashMap原理分析

    一.HashMap的原理 众所周知,HashMap是用来存储Key-Value键值对的一种集合,这个键值对也叫做Entry,而每个Entry都是存储在数组当中,因此这个数组就是HashMap的主干.H ...

  6. window.showModalDialog

    //新版本谷歌没有window.showModalDialog,创建一个window.openif(window.showModalDialog == undefined){  window.show ...

  7. EXT3文件系统误删除导致文件系统中的邮件丢失恢复方法

    一.故障描述 由8块盘组成的RAID5, 上层是EXT3文件系统,由于误删除导致文件系统中的邮件丢失 二.镜像磁盘为防止数据恢复过程中由于误操作对原始磁盘造成二次破坏, 使用winhex软件为每块磁盘 ...

  8. vmware 12 安装 mac os 10.12正式版

    1.首先下载安装vmware 12 pro ,将VT打开(虚拟功能,以前安装过虚拟机点的同学可忽略). 2.下载mac ox 10.12正式版镜像文件(cdr后缀). 3.下载Unlocker208( ...

  9. Centos 6 搭建安装 Gitlab

    官方安装教程 gitlab / gitlab-ce 官网下载:https://www.gitlab.cc/downloads 官网安装说明:https://doc.gitlab.cc/ce/insta ...

  10. python入门（9）字符串和编码

    python入门(9)字符串和编码 字符串是一种数据类型,比较特殊的是字符串有一个编码问题. 因为计算机只能处理数字,如果要处理文本,就必须先把文本转换为数字才能处理. 最早的计算机在设计时采用8个比 ...