<!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. PHP服务端如何通过程序将图上传到指定的图片服务器与图片服务器的优化方案

    一:PHP服务端如何通过程序将图上传到指定的图片服务器与图片服务器的优化方案 (1) php服务器把图片处理成缩率图或指定大小的图片在通过PHP程序代码 操作FTP 上传到图片服务器. 二:图片服务器 ...

  2. activiti自己定义流程之Spring整合activiti-modeler实例（六）：启动流程

    1.启动流程并分配任务是单个流程的正式開始,因此要使用到runtimeService接口.以及相关的启动流程的方法.我习惯于用流程定义的key启动,由于有多个版本号的流程定义时,用key启动默认会使用 ...

  3. EasyNVR摄像机H5流媒体服务器在windows上批处理脚本自动以管理员权限运行

    很多时候, 我们需要以管理员权限来运行批处理脚本, 比如操作 windows 服务. EasyNVR 中提供安装服务的批处理脚本, 运行这个bat文件, 自动将 EasyNVR 以 windows 服 ...

  4. My97datepicker日期控件

    转自:http://www.my97.net/dp/demo/index.htm 非常不错的一篇文章,介绍的很详细.感兴趣的朋友可以好好研究一下. 网上资源很多的,可以下一个来使用. 先说一下整个文件 ...

  5. Dubbo服务集群，常见容错机制：failover ，failsafe，failfase ，failback，forking

    http://blog.csdn.net/hongweigg/article/details/52925920 http://m.blog.csdn.net/article/details?id=51 ...

  6. PHP 格式化数字串

    在xls或csv文件中, 超过12位以上的数字会被"科学计数", 所以当php读取这些文件的时候, 会读成 420E+16 , 显然这不是我们想要的, 所以就要用到数字格式化了! ...

  7. Spring/Java error: namespace element 'annotation-config' … on JDK 1.5 and higher

    Extract the jar file: mkdir spring cd spring jar xvf ../spring.jar Check the Spring version in META- ...

  8. eclips 创建 maven项目

    Maven安装完成后我们就可以在Eclipse中新建自己的Maven项目了.我们可以在Eclipse中选择new一个project,在出现的对话框中选择Maven目录下的Maven Project. ...

  9. 使用expect实现shell自动交互

    expect 是一个自动交互功能的工具.expect 是开了一个子进程,通过 spawn 来执行 shell 脚本,监测到脚本的返回结果,通过 expect 判断要进行的交互输入内容. expect ...

  10. i=i+2 与i+=2

    i=i+2 比 i+=2多了一次对变量 i 的运算.后者效率高