代码实例：

<!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. 8.为什么IntelliJ IDEA首次加载比较慢

    double shift 很快,是有缓存,和快速索引 这面这二个文件,配置会缓存:会越来越在,

  2. Activiti插件安装(二)

    Eclipse安装 网络在线安装:1) 打开 Help -> Install New Software. 在如下面板中: 2) 在如下 Install 界面板中,点击 Add 按钮: 配置新装插 ...

  3. laravel5.6操作数据curd写法(查询构建器)

    laravel5.6 数据库操作-查询构建器 <?php //laravel5.6 语法 demo示例 namespace App\Http\Controllers;//命名该控制App空间下名 ...

  4. C# get和set

    Day1:知识点 1.封装 自己的理解: 可复用,低耦合.就是拿过来就用 只需要关注名称,返回值,参数及参数类型,不需要知道里面怎么实现的. 字段封装的快捷键 (ctrl+r+e)  将光标放在将要封 ...

  5. P3956棋盘

    传送 这看起来有点像个搜索,那我们就用搜索试试. dfs?bfs? 其实都可以,但是窝只会dfs.. 既然这里要用dfs,那么就要把每次搜到(m,m)时,使用的金币数量进行比较,取最小值. 在搜索过程 ...

  6. Java 类装载器工作机制

    类装载器就是寻找类的字节码文件并构造出类在JVM内部表示的对象组件.在java中,类装在器把一个类装入JVM中,要经过以下几个步骤: 1.装载:查找和导入Class文件 2链接:执行校验,准备和解析步 ...

  7. Linux 初始化系统（init）- systemd

    wikipedia 浅析 Linux 初始化 init 系统 systemd 中文手册 fedoraproject - systemd 1. Systemd 简介 Systemd 是 Linux 系统 ...

  8. excel wps access mysql数据表格的查询之路

    简直血崩,最近去做兼职,每天都有大量的表格数据要整理. 开始 还是 用 excel的用起来还算顺畅,慢慢慢慢的发现了各种弊端.大概类似于分组排序什么什么的好多啦~~~不过也确实是用了不到两个小时就能比 ...

  9. poj2431Expedition

    A group of cows grabbed a truck and ventured on an expedition deep into the jungle. Being rather poo ...

  10. Support Vector Machine(1):线性可分集的决策边界

    与Logistuc Regression相比,SVM是一种优化的分类算法,其动机是寻找一个最佳的决策边界,使得从决策边界与各组数据之间存在margin,并且需要使各侧的margin最大化.比较容易理解 ...