<!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. python 基础 6.2 raise 关键字使用

    一. raise 关键字    raise 用来触发异常    语法如下:     raise[Exception [,args [,traceback]]]     语句中Exception 是异常 ...

  2. JS中try.. catch..的用法

    try 测试代码块的错误. catch 语句处理错误. throw 创建并跑出错误. try { //在这里运行代码 抛出错误 } catch(err) { //在这里处理错误 } 下面是一个实例: ...

  3. 以python理解Linux的IO多路复用，select、poll、epoll

    题外话 之前在看Unix环境高级编程的时候,看完高级IO那一章,感觉自己萌萌哒,0.0 ,有点囫囵吞枣的感觉,之后翻了几篇博客,从纯系统的角度理解,稍微有了点概念,以这两篇为例,可以以后参考: htt ...

  4. 3行代码 多元线性方程组 rank=4 多元-一元 降元

    对于线性方程组Ax＝b 对A和b执行同样的一串行初等运算, 那么该方程组的解集不发生变化. [未知-已知   高阶--低阶] http://mathworld.wolfram.com/CramersR ...

  5. Linux安装mariadb详细步骤

    1.安装mariadb yum和源码编译安装的区别? 1.路径区别-yum安装的软件是他自定义的,源码安装的软件./configure --preifx=软件安装的绝对路径 2.yum仓库的软件,版本 ...

  6. [2018-08-25]模板引擎Razor Engine 用法示例

    好久没写博客了,回宁波后最近几个月一直忙些线下的事情. 敲代码方面脱产有阵子了,生疏了,回头一看,这行业果然更新飞快. 最近线下的事情基本忙完,准备开始干回老本行,最重要的一件事就是升级abplus库 ...

  7. Data Structure Binary Tree: Check for Children Sum Property in a Binary Tree

    http://www.geeksforgeeks.org/check-for-children-sum-property-in-a-binary-tree/ #include <iostream ...

  8. 复制一个带random指针的链表

    一个单链表,其中除了next指针外,还有一个random指针,指向链表中的任意某个元素.如何复制这样一个链表呢? 通过next来复制一条链是很容易的,问题的难点在于如何恰当地设置新链表中的random ...

  9. ES6中的class 与prototype

    一.定义构造函数 在以前的js中,生成一个对象实例,需要先定义构造函数,然后通过prototype 的方式来添加方法,在生成实例: function Person(){ this.name = &qu ...

  10. Python爬虫 —— 抓取美女图片

    代码如下: #coding:utf-8 # import datetime import requests import os import sys from lxml import etree im ...