JavaScript 简单计算器

来源:互联网 发布:sql server 字符串主键 编辑:程序博客网 时间:2024/06/07 22:10

这里写图片描述

这里写图片描述

html源代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=GB18030"><title>简单计算器</title></head><body>    <p>简单计算器:</p>    <table border="1" style="position:center;">        <tr>            <td>第一个数:</td>            <td><input type="text" id="first" />            </td>        </tr>        <tr>            <td>第二个数:</td>            <td><input type="text" id="twice" />            </td>        </tr>        <tr>            <td colspan="2">&nbsp;                <button style="width:inherit" onclick="add()">+</button> &nbsp;                <button style="width:inherit" onclick="subtract()">-</button> &nbsp;                <button style="width:inherit" onclick="ride()">*</button> &nbsp;                <button style="width:inherit" onclick="devide()">/</button></td>        </tr>        <tr>            <td colspan="2" rowspan="2">                <p id="result"></p></td>        </tr>    </table>    <script type="text/javascript">        var result_1;        //加法        function add() {            var a = getFirstNumber();            var b = getTwiceNumber();            var re = Number(a) + Number(b);            sendResult(re);        }        //减法        function subtract() {            var a = getFirstNumber();            var b = getTwiceNumber();            var re = a - b;            sendResult(re);        }        //乘法        function ride() {            var a = getFirstNumber();            var b = getTwiceNumber();            var re = a * b;            sendResult(re);        }        //除法        function devide() {            var a = getFirstNumber();            var b = getTwiceNumber();            var re = a / b;            sendResult(re);        }        //给p标签传值        function sendResult(result_1) {            var num = document.getElementById("result")            num.innerHTML = result_1;        }        //获取第一位数字        function getFirstNumber() {            var firstNumber = document.getElementById("first").value;            return firstNumber;        }        //获取第二位数字        function getTwiceNumber() {            var twiceNumber = document.getElementById("twice").value;            return twiceNumber;        }    </script></body></html>
0 0
原创粉丝点击