12/14 计算器雏形

来源:互联网 发布:淘宝类目上限数量 编辑:程序博客网 时间:2024/06/11 08:18

WEB部分

<!DOCTYPE html><html><body><from>第一个数字:<br><input type="text" id="num1"><br>第二个数字:<br><input type="text"id="num2"><br>运算结果:<br><p id="result">结果将在这里显示</p></from><button id="add">+</button><button id="subtract">-</button><button id="multiply">×</button><button id="divide">÷</button></body></html>

JavaScript

// 获取按钮var addBtn = document.getElementById('add');var subtractBtn = document.getElementById('subtract');var multiplyBtn = document.getElementById('multiply');var divideBtn = document.getElementById('divide');var resultNum = document.getElementById('result');// 定义全局变量var a_int;var b_int;// 为按钮添加点击方法addBtn.onclick = function(){    getInputNum();    var result = addition(a_int, b_int);    resultNum.innerHTML = String(result);};subtractBtn.onclick = function(){    getInputNum();    var result = subtraction(a_int, b_int);    resultNum.innerHTML = String(result);};multiplyBtn.onclick = function(){    getInputNum();    var result = multiplication(a_int, b_int);    resultNum.innerHTML = String(result);};divideBtn.onclick = function(){    getInputNum();    var result = division(a_int, b_int);    resultNum.innerHTML = String(result);};// 获取 input 的值转为数字function getInputNum(){    // 这里是局部变量    var a = document.getElementById('num1').value;    var b = document.getElementById('num2').value;    // 将转化后的数字赋值给全局变量    a_int = parseInt(a, 10);    b_int = parseInt(b, 10);}// 加减乘除function addition(x, y){    return x + y;}function subtraction(x, y){    return x - y;}function multiplication(x, y){    return x * y;}function division(x, y){    if (y == 0){        alert('0不能做除数');        return;    }    else{        return x / y;    }}
原创粉丝点击