代码实例：

<!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. linux运维、架构之路-内网NTP时间服务器

    一.环境 [root@m01 tmp]# cat /etc/redhat-release CentOS release 6.9 (Final) [root@m01 tmp]# hostname -I ...

  2. 求超大文件上传方案( Java )

    最近遇见一个需要上传百兆大文件的需求,调研了七牛和腾讯云的切片分段上传功能,因此在此整理前端大文件上传相关功能的实现. 在某些业务中,大文件上传是一个比较重要的交互场景,如上传入库比较大的Excel表 ...

  3. Gym - 101194H Great Cells

    Problem H. Great Cells 题目链接:https://codeforces.com/gym/101194/attachments Input file: Standard Input ...

  4. Arithmetic Sequence

    Arithmetic Sequence Time Limit: 4000/2000 MS (Java/Others)    Memory Limit: 65536/65536 K (Java/Othe ...

  5. pandas 之dataFrame 数据显示不完全的解决方案

    对于这种省略部分,可以使用set_option进行设置,就可以看到了. # 显示所有行(参数设置为None代表显示所有行,也可以自行设置数字) pd.set_option('display.max_c ...

  6. p5342 [TJOI2019]甲苯先生的线段树

    分析  代码 #include<bits/stdc++.h> using namespace std; #define int long long ],yy[],cnt1,cnt2; ][ ...

  7. algorithm_action

    求矩阵Amk.Bkn的乘积 for(i=1;i<=m;i++) for(j=1;j<=n;j++) cij = 0 for(p=1;p<=k;p++) cij += aip*bpj

  8. STM32 ADC基础与多通道采样

    12位ADC是一种逐次逼近型模拟数字数字转换器.它有多达18个通道,可测量16个外部和2个内部信号源.ADC的输入时钟不得超过14MHZ,它是由PCLK2经分频产生.如果被ADC转换的模拟电压低于低阀 ...

  9. ElasticSearch2.2.0安装

    一.ElasticSearch2.2.0安装 1.下载ElasticSearch2.2.0安装包 https://download.elastic.co/elasticsearch/elasticse ...

  10. Linux 路由表详解及 route 命令详解

    参考资料 Linux 内核的路由表 通过 route 命令查看 Linux 内核的路由表: [root@VM_139_74_centos ~]# route Kernel IP routing tab ...