用JavaScript实现简单的计算器功能

最新推荐文章于 2020-10-23 02:16:17 发布

我不想敲代码

最新推荐文章于 2020-10-23 02:16:17 发布

阅读量731

点赞数

本文链接：https://blog.csdn.net/weixin_44265907/article/details/100597481

版权

计算器

首先在HTML中创建
在这里插入图片描述
然后通过 document.getElementById()语句找到各个标签对象

  var txt1=document.getElementById('txt1');//第一个输入框
    var txt2=document.getElementById('txt2');//第二个输入框
    var sel=document.getElementById('sel');//下拉框
    var btn=document.getElementById('btn');//等于按钮
    var jieguo=document.getElementById('txt3');//第三个输入框，用来显示结果

最后给按钮添加点击事件用value属性获取各标签对象中的值，并将用户输入的字符串类型数据用parseInt（）语句转换成number类型，并将运算结果显示到输入框三中（onclick）

  btn.onclick=function(){
        var zhi;//定义一个变量，用来保存结果
    // 用switch语句判断下拉框中选择的运算符号，来执行不同运算
        switch(sel.value){
            case '+': 
            zhi=parseInt(txt1.value)+parseInt(txt2.value);
            break;
            case '-': 
            zhi=parseInt(txt1.value)-parseInt(txt2.value);
            break;
            case '*': 
            zhi=parseInt(txt1.value)*parseInt(txt2.value);
            break;
            case '/': 
            zhi=parseInt(txt1.value)/parseInt(txt2.value);
            break;
            default: 
            alert('请重新输入');
            break;
        }
        txt3.value=zhi;
    }