怎么使用JavaScript實(shí)現(xiàn)網(wǎng)頁(yè)計(jì)算器

這篇文章主要介紹“怎么使用JavaScript實(shí)現(xiàn)網(wǎng)頁(yè)計(jì)算器”，在日常操作中，相信很多人在怎么使用JavaScript實(shí)現(xiàn)網(wǎng)頁(yè)計(jì)算器問(wèn)題上存在疑惑，小編查閱了各式資料，整理出簡(jiǎn)單好用的操作方法，希望對(duì)大家解答”怎么使用JavaScript實(shí)現(xiàn)網(wǎng)頁(yè)計(jì)算器”的疑惑有所幫助！接下來(lái)，請(qǐng)跟著小編一起來(lái)學(xué)習(xí)吧！

共兩個(gè)案例：

案例一圖：

相加：

相減：

相乘：

相除：

代碼如下：

結(jié)構(gòu)：

<p>整數(shù)1： <input type="text" name="" id="num1"> </p>
<p>整數(shù)2： <input type="text" name="" id="num2"> </p>
    <p>
        <input type="button" value="相加" onclick="math(add)">
        <input type="button" value="相減" onclick="math(fuck)">
        <input type="button" value="相乘" onclick="math(doubles)">
        <input type="button" value="相除" onclick="math(fucks)">
    </p>
    <p>結(jié)果：<input type="text" name="" id="result"></p>
   
     <script>
        function math(func) {
            var result = document.getElementById('result');
            var num1 = parseInt(document.getElementById('num1').value);
            var num2 = parseInt(document.getElementById('num2').value);
            if (isNaN(num1) || isNaN(num2)) {
                alert('輸入數(shù)字，你個(gè)傻吊');
                return false;
            } else {
                result.value = func(num1, num2);
            }
        }

        function add(num1, num2) {
            return num1 + num2;
        }

        function fuck(num1, num2) {
            return num1 - num2;
        }

        function doubles(num1, num2) {
            return num1 * num2;
        }

        function fucks(num1, num2) {
            return num1 / num2;
        }
</script>

案例二：

案例圖：（實(shí)現(xiàn)案例圖上的功能）

<script>
        while (true) {
            var choose = parseInt(prompt('歡迎使用簡(jiǎn)易計(jì)算器：' + '\n' + '1.加法操作' + '\n' + '2.減法操作' + '\n' + '3.乘法操作' + '\n' + '4.除法操作' + '\n' + '5.退出'));
            if (choose > 5 || choose <= 0) {
                alert('請(qǐng)輸入1-5之間的選項(xiàng)...');
                continue;
            } else {
                if (choose == 1) {
                    alert('歡迎使用加法計(jì)算器，請(qǐng)輸入需要計(jì)算的兩個(gè)數(shù)值');
                    var num1 = parseFloat(prompt('第一個(gè)數(shù)值：'));
                    var num2 = parseFloat(prompt('第二個(gè)數(shù)值：'));
                    alert('結(jié)果為：' + (num1 + num2));
                    continue;
                } else if (choose == 2) {
                    alert('歡迎使用減法計(jì)算器，請(qǐng)輸入需要計(jì)算的兩個(gè)數(shù)值');
                    var num1 = parseFloat(prompt('第一個(gè)數(shù)值：'));
                    var num2 = parseFloat(prompt('第二個(gè)數(shù)值：'));
                    alert('結(jié)果為：' + (num1 - num2));
                    continue;
                } else if (choose == 3) {
                    alert('歡迎使用乘法計(jì)算器，請(qǐng)輸入需要計(jì)算的兩個(gè)數(shù)值');
                    var num1 = parseFloat(prompt('第一個(gè)數(shù)值：'));
                    var num2 = parseFloat(prompt('第二個(gè)數(shù)值：'));
                    alert('結(jié)果為：' + (num1 * num2));
                    continue;
                } else if (choose == 4) {
                    alert('歡迎使用加法計(jì)算器，請(qǐng)輸入需要計(jì)算的兩個(gè)數(shù)值');
                    var num1 = parseFloat(prompt('第一個(gè)數(shù)值：'));
                    var num2 = parseFloat(prompt('第二個(gè)數(shù)值：'));
                    alert('結(jié)果為：' + (num1 / num2));
                    continue;
                } else {
                    alert('歡迎再次使用');
                    alert('再見(jiàn)');
                    break;
                }
            }

        }
</script>

到此，關(guān)于“怎么使用JavaScript實(shí)現(xiàn)網(wǎng)頁(yè)計(jì)算器”的學(xué)習(xí)就結(jié)束了，希望能夠解決大家的疑惑。理論與實(shí)踐的搭配能更好的幫助大家學(xué)習(xí)，快去試試吧！若想繼續(xù)學(xué)習(xí)更多相關(guān)知識(shí)，請(qǐng)繼續(xù)關(guān)注億速云網(wǎng)站，小編會(huì)繼續(xù)努力為大家?guī)?lái)更多實(shí)用的文章！