JS&jQuery初级06

来源:互联网 发布:疯狂原始人 知乎 编辑:程序博客网 时间:2024/06/05 11:52

这节课主要是写一个加减乘除的计算器。
知识点:

  • 获取按钮
  • 创建函数
  • 调用函数
  • 局部变量和全局变量

定义在函数外面的就是全局变量,整个JS文件都可以使用;
在函数里面定义的叫局部变量,只有函数内能够使用,外部是不能够调用的。

如果几个动作重复的话,可以把他们组成一个函数,每次用的时候调用就可以了。

<!DOCTYPE html><html><body><form> 第一个数字:<br>    <input type="text" id="num1" value="100">    <br>    第二个数字:<br>    <input type="text" id="num2" value="200">    <br>  </form>    <button id="add"></button><button id="subtract"></button><button id="multiply">×</button><button id="divide">÷</button></body></html>
var addBtn=document.getElementById('add');var subtractBtn=document.getElementById('subtract');var multiplyBtn=document.getElementById('multiply');var divideBtn=document.getElementById('divide');//下面两个是全局变量。var a_int;var b_int;addBtn.onclick=function(){    getInputNum();    var result=addiction(a_int,b_int);    alert(result);           };subtractBtn.onclick=function(){    getInputNum();    var result=subtraction(a_int,b_int);    alert(result);           };multiplyBtn.onclick=function(){    getInputNum();    var result=multiplication(a_int,b_int);    alert(result);           };divideBtn.onclick=function(){    getInputNum();    var result=division(a_int,b_int);    alert(result);           };function getInputNum(){//a和b就是局部变量。    var a=document.getElementById('num1').value;//调用页面里的num1元素的值。    var b=document.getElementById('num2').value;   a_int=parseInt(a,10);//按照十进制,把字符转换成数值。    b_int=parseInt(b,10);    }function addiction(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;        }    }
原创粉丝点击