代码实例：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>计算器实例效果</title>

     <script type="text/javascript">

         var compute=function (val) {

             var num1=parseFloat(document.getElementById("num1").value);

             var num2=parseFloat(document.getElementById("num2").value);

             var num3=document.getElementById("num3");

             if(val=='+') {

                 num3.value=num1+num2;

             }

             if(val=='-') {

                 num3.value=num1-num2;

             }

             if(val=='*') {

                 num3.value=num1*num2;

             }

             if(val=='/') {

                 num3.value=num1/num2;

             }

         }

     </script>

</head>

<body>

<h2>计算器</h2>

数字1:<input type="text"  id="num1"><br/>

数字2:<input type="text"  id="num2"><br/>

<input type="button"  value="+" onclick="compute(this.value)"/>

<input type="button"  value="-" onclick="compute(this.value)"/>

<input type="button"  value="*" onclick="compute(this.value)"/>

<input type="button"  value="/" onclick="compute(this.value)"/><br>

结果:<input type="text"   id="num3"/><br>

</body>

</html>

效果：

2017-09-05 00:00:33

JavaScript实例之计算器的更多相关文章

  1. JavaScript实例

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xht ...

  2. 每天一个JavaScript实例-从一个div元素删除一个段落

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  3. 纯javascript代码编写计算器程序

    今天来分享一下用纯javascript代码编写的一个计算器程序,很多行业都能用到这个程序,例如做装修预算.贷款利率等等. 首先来看一下完成后的效果: 具体代码如下:(关注我的博客,及时获取最新WEB前 ...

  4. 每天一个JavaScript实例-推断图片是否载入完毕

    <!doctype html> <html lang="en"> <head> <meta charset="utf-8&quo ...

  5. 每天一个JavaScript实例-动态省份选择城市

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  6. 每天一个JavaScript实例-递归实现反转数组字符串

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  7. 每天一个JavaScript实例-html5拖拽

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  8. 每天一个JavaScript实例-canvas绘图

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  9. 一些有用的javascript实例分析(三)

    原文:一些有用的javascript实例分析(三) 10 输入两个数字,比较大小 window.onload = function () { var aInput = document.getElem ...

随机推荐

  1. 【CF1243C】 Tile Painting【思维】

    题意:给定长度为n的方块,要求染色,需要满足:当|j-i|>1且n%|j-i|==0时,两格颜色相同,求做多可以染多少种颜色 题解:求出n的所有质因子 1.若只有一种质因子,则答案为该质因子 2 ...

  2. char* 和 cha[]

    char* s1 = "hello";//字符串常量 s是一个保存了字符串首地址的指针变量,同时也是字符串的名字,s的内容是第一个字符的地址,当s指向常量字符串时候,内容不能改变( ...

  3. php strtotime,mktime,DateTime函数处理时间累加问题

    时间戳(年月日时分秒)  使用strtotime函数,结合+1 month,-1 month,next month,last month的时候会出现一些问题. demo示例: //时间"20 ...

  4. 相同name,取最小的id的值，mysql根据相同字段　更新其它字段

    id name info1 a 1232 a 2353 a 1244 b 125 b 987相同name,取最小的id的值id name info1 a 1232 a 1233 a 1234 b 12 ...

  5. Search Engine Hacking – Manual and Automation

    Search Engine Hacking – Manual and Automation Ethical Hacking Boot Camp OUR MOST POPULAR COURSE! CLI ...

  6. AndroidStudio3.4+Unity2018.3，导出JAR包给UNITY使用

    环境 Android studio 3.4 + unity2018.3 1,android studio 新建空工程,一切默认,完成.这个空工程只是个壳,它的所有参数都没什么用,它存在的意义是为了后面 ...

  7. Tomcat GC参数详解

    tomcat启动参数,将JVM GC信息写入tomcat_gc.log CATALINA_OPTS='-Xms512m -Xmx4096m -XX:PermSize=64M -XX:MaxNewSiz ...

  8. Jmeter 上传下载文件

    最近很多同学都在问jmeter上传.下载文件的脚本怎么做,要压测上传.下载文件的功能,脚本怎么做,网上查了都说的很含糊,这次呢,咱们就好好的把jmeter的上传下载文件好好缕缕,都整明白了,怎么个过程 ...

  9. Cadence 学习

    记录学习Cadence的资料 Cadence 16.6软件             链接: http://pan.baidu.com/s/1mgwSeYs 密码: jemk 于博士视频教程(15.7版 ...

  10. 经常用到的meta标签的整理

    1.设置页面关键词<meta name="keywords" content="输入具体的关键词">2.设置页面的描述<meta name=& ...