利用JavaScript操作标签对象和循环写一个简易计算器

最新推荐文章于 2024-10-15 09:57:04 发布

小高今天早睡了吗？

最新推荐文章于 2024-10-15 09:57:04 发布

阅读量301

点赞数

分类专栏： JavaScript习题文章标签： javascript 前端开发语言

本文链接：https://blog.csdn.net/m0_55710075/article/details/121781685

版权

JavaScript习题专栏收录该内容

14 篇文章 0 订阅

订阅专栏

利用JavaScript操作标签对象和循环语句写一个简易计算器，可以实现加减乘除。

<body>
    <input type="text" id = "inp1">
    <select name="" id="symbol">
        <option value="+">+</option>
        <option value="-">-</option>
        <option value="*">*</option>
        <option value="/">/</option>
    </select>
    <input type="text" id= "inp2">
    <button id="btn">=</button>
    <input type="text" id="result">

    <script>
        //拿到相关对象
        var oInp1 = document.getElementById('inp1');
        var oInp2 = document.getElementById('inp2');
        var oBtn = document.getElementById('btn');
        var oSymbol = document.getElementById('symbol');
        var oResult = document.getElementById('result');

        //绑定点击事件
        oBtn.onclick = function(){
            var symbol = oSymbol.value;
            console.log(symbol);

            //拿到第一个值
            var n1 = oInp1.value;

            //拿到第二个值
            var n2 = oInp2.value;

            //根据符号来计算
            if(symbol == "+"){
                var sum = n1*1 + n2*1;
                oResult.value = sum;
            }
            else if(symbol == "-"){
                var sum = n1 - n2;
                oResult.value = sum;
            }
            else if(symbol == "*"){
                var sum = n1 * n2;
                oResult.value = sum;
            }
            else if(symbol == "/"){
                var sum = n1 / n2;
                oResult.value = sum;
            }
        }
    </script>
</body>