JS学习笔记（三）

一、for循环的使用（乘法表）部分JS代码：

<script type="text/javascript">            for(var i=1;i<10;i++){                for(var j=1;j<10;j++){                    document.write(i+"*"+j+"=""+i*j+(i*j>=10 ? " ":"&nbsp";));                }                document.write("<br/>")            }        </script>

二、简单的支付JS：

<script>    //js写在后边  元素初始化之后执行     //获取按钮    var btn=document.getElementsByClassName("btn_gou")[0];   //给对象添加事件    btn.onclick=function (){        //获取单价        var price=document.getElementsByClassName("price")[0].value;        var num=document.getElementsByClassName("num")[0].value;        //获取折扣方式        var way=document.getElementById("select_info");        var res=0;        switch (way.value)        {            case "QQ支付":res=0.95;break;            case "微信支付":res=0.90;break;            case "支付宝付":res=0.85;break;        }        var totleprice=price*num*res;        /*if结构*/        if(totleprice<500)        {             alert("赠送两枚Q币！");        }        else if(totleprice>=500&&totleprice<1000)        {           alert("赠送吹风机一个！");        }        else{            alert("多买点！！");        }        /*do while   while*/        while(totleprice<100)        {            alert("太抠了！");            return;        }        alert("您需要支付："+totleprice+"元")    }</script>

三、计算器

<script>    //定义一个空的数组    var result = [];    //先获取所有的按钮  添加点击事件    var btn = document.getElementsByClassName("btn");    //获取屏幕显示器    var Screen = document.getElementsByClassName("txt")[0];    for (var i = 0; i < btn.length; i++) {        btn[i].onclick = function () {            //字符串的拼接            //先判断屏幕上有没有点  indexOf(".")  判断有没有符号   有返回索引位置   没有返回-1            if (!isNaN(this.value) || this.value == ".") {                if (Screen.value.indexOf(".") == -1) {                    Screen.value += this.value;                }                else {                    if (this.value != ".") {                        Screen.value += this.value;                    }                }            }            else {                //非数字                //先判断+ - *  /                if (this.value == "+" || this.value == "-" || this.value == "*" || this.value == "/") {                    //先将界面的值存储到数组里面                    /*    逻辑判断   符号问题  多次按（替换）？？？？？？？？？？？？*/                    result[result.length] = Screen.value;                    //将符号存储                    result[result.length] = this.value;                    Screen.value = "";                }                if (this.value == "=") {                    result[result.length] = Screen.value;                    var str = "";                    for (var a in result) {                        str += result[a];                    }                    Screen.value = eval(str);                    /*  eval()  专门用来计算表达式的  */                    //计算完成之后将数组清空                    result = [];                }                if (this.value == "C") {                    Screen.value = "";                    result = [];                }                //删除                if (this.value == "D") {                    /* 截取字符串 substr (从那开始  截取到少长度)   substring（从那开始到那结束）*/                    Screen.value = Screen.value.substr(0, Screen.value.length - 1);                }            }        }    }</script>

四、事件的绑定（JS中事件之前都有on）分两种
1.直接元素里面绑定（行内）
2.代码里面直接书写（JS脚本中）
常用的有：onclick onmousemove onmouseenter onmouseleave onmouseout onmouseover onfocus onblur