JavaScript实现简易计算器

最新推荐文章于 2023-12-01 19:30:20 发布

爷爷我回来了

最新推荐文章于 2023-12-01 19:30:20 发布

阅读量664

点赞数 2

分类专栏： JavaScript 文章标签： JavaScript 计算器

本文链接：https://blog.csdn.net/sinat_34074514/article/details/80842889

版权

JavaScript 专栏收录该内容

16 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>IFE ECMAScript</title>
</head>

<body>
    <input id="first-number" type="number" value="0" placeholder="第一个数字">
    <input id="second-number" type="number" value="0" placeholder="第二个数字">
    <button id="add-btn" οnclick="add()">加</button>
    <button id="minus-btn" οnclick="minus()">减</button>
    <button id="times-btn" οnclick="multiply()">乘</button>
    <button id="divide-btn" οnclick="divide()">除</button>
    <p id="result">运算结果</p>
    <script>
        function add() {
            document.getElementById("result").innerHTML = (parseInt(document.getElementById("first-number").value) + parseInt(document.getElementById("second-number").value)); 
        }
        function minus() {
            document.getElementById("result").innerHTML = (parseInt(document.getElementById("first-number").value) - parseInt(document.getElementById("second-number").value)); 
        }
        function multiply() {
            document.getElementById("result").innerHTML = (parseInt(document.getElementById("first-number").value) * parseInt(document.getElementById("second-number").value)); 
        }
        function divide() {
            document.getElementById("result").innerHTML = (parseInt(document.getElementById("first-number").value) / parseInt(document.getElementById("second-number").value)); 
        }
    </script>
</body>

</html>

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>IFE ECMAScript</title>
</head>

<body>
    <input id="first-number" type="number" value="0" placeholder="第一个数字">
    <input id="second-number" type="number" value="0" placeholder="第二个数字">
    <button id="add-btn">加</button>
    <button id="minus-btn">减</button>
    <button id="times-btn">乘</button>
    <button id="divide-btn">除</button>
    <p id="result">运算结果</p>
    <script>
        var btn1 = document.querySelector("#add-btn");
        var btn2 = document.querySelector("#minus-btn");
        var btn3 = document.querySelector("#times-btn");
        var btn4 = document.querySelector("#divide-btn");
        function add() {
            document.getElementById("result").innerHTML = (parseInt(document.getElementById("first-number").value) + parseInt(document.getElementById("second-number").value)); 
        }
        function minus() {
            document.getElementById("result").innerHTML = (parseInt(document.getElementById("first-number").value) - parseInt(document.getElementById("second-number").value)); 
        }
        function times() {
            document.getElementById("result").innerHTML = (parseInt(document.getElementById("first-number").value) * parseInt(document.getElementById("second-number").value)); 
        }
        function divide() {
            document.getElementById("result").innerHTML = (parseInt(document.getElementById("first-number").value) / parseInt(document.getElementById("second-number").value)); 
        }
        btn1.addEventListener("click", add);
        btn2.addEventListener("click", minus);
        btn3.addEventListener("click", times);
        btn4.addEventListener("click", divide);
    </script>
</body>

</html>

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>IFE ECMAScript</title>
</head>

<body>
    <input id="first-number" type="number" value="0" placeholder="第一个数字">
    <input id="second-number" type="number" value="0" placeholder="第二个数字">
    <button id="add-btn">加</button>
    <button id="minus-btn">减</button>
    <button id="times-btn">乘</button>
    <button id="divide-btn">除</button>
    <p id="result">运算结果</p>
    <script>
        var btn1 = document.querySelector("#add-btn");
        var btn2 = document.querySelector("#minus-btn");
        var btn3 = document.querySelector("#times-btn");
        var btn4 = document.querySelector("#divide-btn");
        function add() {
            document.getElementById("result").innerHTML = (parseInt(document.getElementById("first-number").value) + parseInt(document.getElementById("second-number").value)); 
        }
        function minus() {
            document.getElementById("result").innerHTML = (parseInt(document.getElementById("first-number").value) - parseInt(document.getElementById("second-number").value)); 
        }
        function times() {
            document.getElementById("result").innerHTML = (parseInt(document.getElementById("first-number").value) * parseInt(document.getElementById("second-number").value)); 
        }
        function divide() {
            var divisor = parseInt(document.getElementById("second-number").value);
            try {
                if (divisor == 0) {
                    throw "除数不能为零！";
                }
            } catch (error) {
                console.log(error);
            }
            document.getElementById("result").innerHTML = (parseInt(document.getElementById("first-number").value) / divisor); 
        }
        btn1.addEventListener("click", add);
        btn2.addEventListener("click", minus);
        btn3.addEventListener("click", times);
        btn4.addEventListener("click", divide);
    </script>
</body>

</html>

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>IFE ECMAScript</title>
</head>

<body>
    <input id="first-number" type="number" value="0" placeholder="第一个数字">
    <input id="second-number" type="number" value="0" placeholder="第二个数字">
    <button id="add-btn">加</button>
    <button id="minus-btn">减</button>
    <button id="times-btn">乘</button>
    <button id="divide-btn">除</button>
    <p id="result">运算结果</p>
    <script>
        var btn1 = document.querySelector("#add-btn");
        var btn2 = document.querySelector("#minus-btn");
        var btn3 = document.querySelector("#times-btn");
        var btn4 = document.querySelector("#divide-btn");
        function add() {
            return (parseInt(document.getElementById("first-number").value) + parseInt(document.getElementById("second-number").value)); 
        }
        function minus() {
            return (parseInt(document.getElementById("first-number").value) - parseInt(document.getElementById("second-number").value)); 
        }
        function times() {
            return (parseInt(document.getElementById("first-number").value) * parseInt(document.getElementById("second-number").value)); 
        }
        function divide() {
            var divisor = parseInt(document.getElementById("second-number").value);
            try {
                if (divisor == 0) {
                    throw "除数不能为零！";
                }
            } catch (error) {
                console.log(error);
            }
            return (parseInt(document.getElementById("first-number").value) / divisor); 
        }
        btn1.addEventListener("click", add);
        btn2.addEventListener("click", minus);
        btn3.addEventListener("click", times);
        btn4.addEventListener("click", divide);
        btn1.addEventListener("click", function() {
            document.getElementById("result").innerHTML = add();
        });
        btn2.addEventListener("click", function() {
            document.getElementById("result").innerHTML = minus();
        });
        btn3.addEventListener("click", function() {
            document.getElementById("result").innerHTML = times();
        });
        btn4.addEventListener("click", function() {
            document.getElementById("result").innerHTML = divide();
        });
    </script>
</body>

</html>

爷爷我回来了

关注

2
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
JavaScript实现简易计算器

&lt;!DOCTYPE html&gt;&lt;html&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;IFE ECMAScript&lt;/title&gt;&lt;/head&gt;&lt;body&gt; &lt;input id=&quot
复制链接

扫一扫