利用js制作简单加减乘除计算器

最新推荐文章于 2023-12-22 09:40:00 发布

Truam丶

最新推荐文章于 2023-12-22 09:40:00 发布

阅读量1.8k

点赞数 1

分类专栏： js 文章标签： javascript 前端

本文链接：https://blog.csdn.net/m0_64803670/article/details/122986657

版权

js 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>

    <script>
        function fun() {
            var n1 = document.querySelector("#num1")
            var n2 = document.querySelector("#num2")
            var n3 = document.querySelector("#num3")
           var a = document.getElementById("select");
           var b= a.options[a.selectedIndex].value;
        
            var n1v = n1.value
            var n2v = n2.value

            if (b=="+") {
                var avgv = parseInt(n1v) + parseInt(n2v)
            } else if (b=="-") {
                var avgv = (parseInt(n1v) - parseInt(n2v))
            } else if (b=="*") {
                var avgv = (parseInt(n1v) * parseInt(n2v))
            } else if (b=="/") {
                var avgv = (parseInt(n1v) / parseInt(n2v))

            } else {
                alert("请重新选择符号")
                return
            }

            n3.value = avgv



        }
    </script>
</head>

<body align="center">
    <input type="text" name="num1" id="num1" style="width: 70px;">
    <select name="select" id="select">
        <option value="0" selected> 请输入运算符</option>
        <option value="+">+</option>
        <option value="-">-</option>
        <option value="*">*</option>
        <option value="/">/</option>
    </select>
    <input type="text" name="num2" id="num2" style="width: 70px;">
    <input type="submit" value="=" onclick="fun()">
    <input type="text" name="num3" id="num3" style="width: 70px;">

</body>

</html>

成品图：