为了账号安全,请及时绑定邮箱和手机立即绑定

JavaScript制作简易计算器

标签:
JavaScript
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <style>
        .button
        {
            width: 55px;
            height: 20px;
        }
    </style>
</head>
<body>

    <table align="center">
        <tr>
            <td></td>
            <td>购物简易计算器</td>
        </tr>
        <tr>
            <td>第一个数</td>
            <td><input type="text" id="oneNum"/></td>
        </tr>
        <tr>
            <td>第二个数</td>
            <td><input type="text" id="twoNum"/></td>
        </tr>
        <tr>
            <td colspan="2">
                <input onclick="add()" type="button" id="add" value="+" class="button" />
                <input onclick="sub()" type="button" id="sub" value="-" class="button"/>
                <input onclick="mul()" type="button" id="mul" value="*" class="button"/>
                <input onclick="divide()" type="button" id="divide" value="/" class="button"/>
            </td>
        </tr>
        <tr>
            <td>计算结果</td>
            <td><input type="text" id="result"/></td>
        </tr>
    </table>

</body>
<script>
    var num_1=document.getElementById("oneNum");
    var num_2=document.getElementById("twoNum");
    var result=document.getElementById("result");

    function add(){
        result.value=parseFloat(num_1.value)+parseFloat(num_2.value);
    }
    function sub(){
        result.value=parseFloat(num_1.value)-parseFloat(num_2.value);
    }
    function mul(){
        result.value=parseFloat(num_1.value)*parseFloat(num_2.value);
    }
    function divide(){
        result.value=parseFloat(num_1.value)/parseFloat(num_2.value);
    }

</script>
</html>
点击查看更多内容
4人点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消