10月22号作业 js基础

1、把JS数组相关函数案例、常用事件案例练习一遍

if判断：

    var score=50;
    if(score<60){
        console.log('流程控制:'+'不及格');
    }
    if(score>=60&&score<80){
        console.log('流程控制:'+'合格');
    }
    if(score>=80&&score<95){
        console.log('流程控制:'+'优秀');
    }
    if(score>=90&&score<=100){
        console.log('流程控制:'+'十分优秀');
    }

swidth判断：

var day=2;
    var week;
    switch(day){
        case 1:
            week="星期一";
            break;
        case 2:
            week="星期二";
            break;
        case 3:
            week="星期三";
            break;
        case 4:
            week="星期四";
            break;
        case 5:
            week="星期五";
            break;
        case 6:
            week="星期六";
            break;
        case 7:
            week="星期日";
    }
    console.log('switch使用:'+week);

for循环：

for (var i=0;i<10;i++){
        console.log('for循环：i='+i);
    }
    var arr = ['html','css','javascript','php','mysql','java'];
    for (var k = 0; k < arr.length; k++) {
        console.log(arr[k]);
    }

while (条件) {…} ：会先判断在执行。

do{}while()循环 ：先执行后判断。

    var i =0;
    do {
        console.log('这是do{}while()循环下的i:'+i);
        i++;
    }while(i<10)
    var k = 0;
    while(k<10){
        console.log('这是while(){}循环下的k:'+k);
        k++;
    }

break：退出循环，循环终止。

continue：仅结束本次循环，循环继续执行。

    for (var i = 0; i < 10;i++){
        if(i==5){break;}
        console.log('break测试：'+i);
    }
    for (var k = 0; k < 10;k++){
        if(k==5){continue;}
        console.log('continue测试：'+k);
    }

类型装换

parseInt():字符串转整型

    var num = '123';
    console.log('格式是：'+typeof num+'---数据是：'+num);
    var res = parseInt(num);
    console.log('格式是：'+typeof res+'---数据是：'+res);

—数组注意事项：
1、不要自定义数组下标，否则会影响数组长度的计算
2、array.push() 往数组尾部添加一个元素
3、array.pop() 从数组尾部去除一个元素
4、array.shift() 头部获取，并删除第一个元素
5、array.unshift() 头部添加，并返回新的长度
6、array.splice(index,howmany) 删除数组中的元素，index：从哪里开始删，howmany：删多少个元素
7、查询数组下标array.indexOf(searchvalue,fromindex)查找某个元素在数组中的下标。

    var arr = [1,2,3];
    arr.push(10,20,30,40);
    arr.pop();
    arr.shift();
    arr.unshift(1,1,1,1,1,1,1);
    arr.splice(0,6);
    // arr[8] = 10;
    console.log('数组长度：'+arr.length+'数组：'+arr);
    var res = arr.indexOf(10,0);
    console.log('目标数组下标是'+res);

页面跳转：
window.location.href = ‘http://www.php.cn‘; 页面将跳转到php中文网首页
window.location.open(‘http://www.php.cn‘); 会打开一个新窗口，并打开php中文网首页

mouse触发事件：
onclick 元素上发生鼠标点击时触发。
onmousedown 当元素上按下鼠标按钮时触发。
onmousemove 当鼠标指针移动到元素上时触发。
onmouseout 当鼠标指针移出元素时触发。
onmouseover 当鼠标指针移动到元素上时触发。
onmouseup 当在元素上释放鼠标按钮时触发。
onmousewheel 当鼠标滚轮正在被滚动时运行的脚本。

<div onmouseover="func_onmouseover()" onmouseleave="func_onmouseleave()">鼠标移动触发事件</div>
<script>
    function func_onmouseover(){
        console.log('鼠标移上来了');
    }
    function func_onmouseleave(){
        console.log('鼠标移走了');
    }
</script>

onblur元素失去焦点时触发该事件

主要用于input元素，div p元素因为没有焦点，所以没有该事件

<input type="text" id="email" onblur="chk()">
<script>
    function chk(){
        var email = document.getElementById('email').value;
        if(email=' '){console.log('输入邮箱为空')}
        else{console.log('邮箱不为空，请执行')}
    }
</script>

onchange

<select id="province" onchange="chk()">
    <option value="anhui">安徽</option>
    <option value="beijing">北京</option>
    <option value="shanghai">上海</option>
</select>
<script>
    function chk(){
        var province = document.getElementById('province').value;
        console.log('当前选择的是'+province);
    }
</script>

定时器
setTimeout(function(){},n) 多少秒后执行一次参数中的匿名函数，仅执行一次
setInterval(function(){},n); 每隔多少秒执行一次参数中的匿名函数，定时重复执行
clearInterval(); 清除由setInterval函数设置的定时器

<script>
    setTimeout(function(){
        console.log('输出一次');
    },2000);
    var i=0;
    var timer = setInterval(function(){
        console.log('输出一次'+i);
        i++;
// 输出10次后，清除定时器
        if(i>10){
            clearInterval(timer);
        }
    },1000);
</script>