<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/html">

<head lang="en">

    <meta charset="UTF-8">

    <title></title>

    <script>

        function add(){

            var a=parseInt(document.getElementById("num1").value);/*获取a的值*/

            var b=parseInt(document.getElementById("num2").value);

            var c=parseInt(document.getElementById("num3").value=a+b);/*value=a+b 将a+b的值传给num3*/

           // alert(a+b);

        }

        function de(){

            var a=parseInt(document.getElementById("num1").value)/*获取a的值*/

            var b=parseInt(document.getElementById("num2").value);

            var c=parseInt(document.getElementById("num3").value=a-b);

           // alert(a-b);

        }

        function mul(){            /*放在方法里，点击才开始访问数据*/

            var a=parseInt(document.getElementById("num1").value);/*获取a的值*/

            var b=parseInt(document.getElementById("num2").value);

            var c=parseInt(document.getElementById("num3").value=a*b);

            //alert(a*b);

        }

        function chu(){

            var a=parseInt(document.getElementById("num1").value);/*获取a的值*/

            var b=parseInt(document.getElementById("num2").value);

            var c=parseInt(document.getElementById("num3").value=a/b);

           // alert(a/b);

        }

    </script>

</head>

<br>

    <label>简易计算器</label></br>

    <label>第一个数：</label><input type="=text" id="num1"></br>

    <label>第二个数：</label><input type="=text" id="num2"></br>

    <button onclick="add()">+</button>

    <button onclick="de()">-</button>

    <button onclick="mul()">*</button>

    <button onclick="chu()">/</button><br>

    <label>结果：</label><input type="text" id="num3">

</body>

</html>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/html">
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <script>
        function add(){
            var a=parseInt(document.getElementById("num1").value);/*获取a的值*/
var b=parseInt(document.getElementById("num2").value);
            var c=parseInt(document.getElementById("num3").value=a+b);/*value=a+b 将a+b的值传给num3*/
alert(a+b);
        }
        function de(){
            var a=parseInt(document.getElementById("num1").value)/*获取a的值*/
var b=parseInt(document.getElementById("num2").value);
            var c=parseInt(document.getElementById("num3").value=a-b);
            alert(a-b);
        }
        function mul(){            /*放在方法里，点击才开始访问数据*/
var a=parseInt(document.getElementById("num1").value);/*获取a的值*/
var b=parseInt(document.getElementById("num2").value);
            var c=parseInt(document.getElementById("num3").value=a*b);
            alert(a*b);
        }
        function chu(){
            var a=parseInt(document.getElementById("num1").value);/*获取a的值*/
var b=parseInt(document.getElementById("num2").value);
            var c=parseInt(document.getElementById("num3").value=a/b);
            alert(a/b);
        }
    </script>
</head>
<br>
    <label>简易计算器</label></br>
    <label>第一个数：</label><input type="=text" id="num1"></br>
    <label>第二个数：</label><input type="=text" id="num2"></br>
    <button onclick="add()">+</button>
    <button onclick="de()">-</button>
    <button onclick="mul()">*</button>
    <button onclick="chu()">/</button><br>
    <label>结果：</label><input type="text" id="num3">
</body>
</html>

JS编写简易计算器的更多相关文章

  1. 使用html+css+js实现简易计算器

    使用html+css+js实现简易计算器, 效果图如下: html代码如下: <!DOCTYPE html> <html lang="en"> <he ...

  2. 项目：JS实现简易计算器案例

    组件化网页开发下的: 步骤一:让页面动起来的JavaScript深入讲解  的 项目:JS实现简易计算器案例

  3. 用js制作简易计算器及猜随机数字游戏

    <!doctype html><html><head> <meta charset="utf-8"> <title>JS ...

  4. 原生JS实现简易计算器

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  5. 用JS编写个人所得税计算器

    编写 “个人所得税计算器”函数 计算个税的方法: 3500 以下免征 3500 ~ 5000 部分 缴纳 3% 5000 ~ 9000 部分 缴纳 10% 9000 以上部分 缴纳 20% 代码如下: ...

  6. js之简易计算器

    <!DOCTYPE html PUBLIC "-//W3C//Dli XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. JS实现简易计算器的7种方法

    先放图(好吧比较挫) 方法一:最容易版 <!DOCTYPE html> <html lang="zh-CN"> <head> <meta ...

  8. html、css、js实现简易计算器

    学习HTML,CSS,JS一个月后,想着能自己是否能写出一个简单的东西,故编写了简易的计算器,之前也写过一个坦克大战,坦克大战的有些基本功能没有实现, 故也没有记录下来,想来,对这行初来咋到的,还是需 ...

  9. JS简易计算器的实现，以及代码的优化

    用JS实现简易计算器 首先创建结构和样式 <!DOCTYPE html> <html lang="en"> <head> <meta ch ...

随机推荐

  1. zeroMQ研究（转）

    偶尔一个机会,了解了下zeroMQ消息队列. 1  ZeroMQ概述 ZeroMQ是一种基于消息队列的多线程网络库,其对套接字类型.连接处理.帧.甚至路由的底层细节进行抽象,提供跨越多种传输协议的套接 ...

  2. 14、AppWidget及Launcher RemoteViews

    一.Launcher的简单研究 1 什么是Launcher Android系统启动后加载的第一个程序 . 这个程序是其他应用程序的入口 . Launcher构成: HomeScreen : (Work ...

  3. 源码编译mysql 5.5+ 安装过程全记录

    前言:从mysql 5.5版本开始,mysql源码安装开始使用cmake了,编译安装跟以前的版本有点不一样了. 一,安装步骤: 1.安装前准备工作 a.下载mysql源代码包,到mysql下载页面选择 ...

  4. MaLoc: a practical magnetic fingerprinting approach to indoor localization using smartphones

    https://www.indooratlas.com/ MaLoc: a practical magnetic fingerprinting approach to indoor localizat ...

  5. visio_action

    bug---沟通效率不能为负值!! https://blogs.office.com/en-us/2012/11/05/containers-and-callouts-in-visio/?eu=tru ...

  6. BZOJ4920: [Lydsy1706月赛]薄饼切割

    BZOJ4920: [Lydsy1706月赛]薄饼切割 Description 有一天,tangjz送给了quailty一张薄饼,tangjz将它放在了水平桌面上,从上面看下去,薄饼形成了一个H*W的 ...

  7. 查看物料凭证MB03 /MIGO A04-显示，R02-物料凭证

    当货物移动操作后,可以使用事物码MB03.MIGO查询最近一次生成的物料凭证, 如果未知凭证号,Table:MKPF / AUFM/EKBE MKPF 抬头:物料凭证 KEY: MBLNR 物料凭证编 ...

  8. API的理解和使用——全局命令

    全局命令 命令 功能 set 创建键值对 keys 遍历查看所有键 exists 判断一个键是否存在,1存在,0不存在 dbsize 当前数据库中有多少个键 del 删除一个或多个键 expire 设 ...

  9. 20145239 实验一 Java开发环境的熟悉(Windows + IDEA)

    实验一 Java开发环境的熟悉(Windows + IDEA) 实验内容 1.使用JDK编译.运行简单的Java程序:2.使用Eclipse 编辑.编译.运行.调试Java程序. 实验知识点 1.JV ...

  10. 51Nod 1225 余数之和 —— 分区枚举

    题目链接:http://www.51nod.com/onlineJudge/questionCode.html#!problemId=1225 1225 余数之和  基准时间限制:1 秒 空间限制:1 ...