js基础学习2

关于if判断不同类型的false比较

1、常见的不执行的值：false,0 null,"",undefined;
2、分类：
  2.1、 0,false,""可以进行比较，并且相当

        var res1 = 0;
        var res2 = false;
        if(res1 == res2){
            console.log("if代码块");
        }
        else{
            console.log("else代码块");
         }

效果图：

  2.2、 null，变量赋值为undefined 可以进行比较，并且相等。

        var res1 = null;
        var res2 = undefined;
        if(res1 == res2){
            console.log("if代码块");
        }
        else{
            console.log("else代码块");
         }

效果图：

  2.3、 变量没有定义和变量定义并且赋值为undefined不一样，变量定义就是有一个空间存储这个名词，而未定义就找不到该变量名。

 var res2 = undefined;
        if(res1 == res2){
            console.log("if代码块");
        }
        else{
            console.log("else代码块");
         }

效果图：

关于空格的判断

通过isNaN判断空格是否是数字时，计算机会将空格当做0来处理。

        var val = " ";
        for(var i = 0; i < val.length; i++){
            var c = val[i];
            console.log(val[i])
            // var c = val.charAt(i);
            // var c = val.substring(i,i+1);
            //substring,截取字符串，大于等于第一个位子小于第二个位置
            //一般空格在计算机中会当做数字0来处理。
            if(!isNaN(c)){
                alert("用户名不能包含数值！");
                break;
            }
        }

通过id,class,标签名获取标签

1、document.querySelector()和css获取标签一样，可以获取到子代，后代等标签。

    //普通的获取到id=a的标签
    <div id="a"></div>
    <script>
        document.querySelector("#a").innerHTML = "你好！";
    </script>

// 获取到子代的标签
div class="b"><div id="a"></div></div>
<script>
    document.querySelector(".b>#a").innerHTML = "你好！";
</script>

关于提示确认文本框的介绍

1、confirm是一个提示确认框。它可以返回true或者false。

    <script>
        if(confirm("是否退出！")){
            document.write("退出");
        }else{
            document.write("不退出");
        }
    </script>

效果图：

关于鼠标和键盘的事件

1、鼠标放置到某个标签上发生的事件onmouseover/onmouseenter。onmouseover它是将鼠标放置在子类上，他会先移出父类响应，然后响应子类，最后又返回父类。
onmouseenter表示忽略父类上的子类，将子类看是父类的一部分。

    <div id="dv" onmouseenter="console.log('进来')" onmouseleave="console.log('出去')">
        <div id="children"></div>
    </div>

   <div id="dv" onmouseover="console.log('a')" onmouseleave="console.log('出去')">
        <div id="children" onmouseover="bb();"></div>
    </div>

2、onmouseout/onmouseleave表示移出某个控件的上方。
onmouseout配合的是onmouseover的效果，而onmouseleave一般配合的是onmouseleave事件的效果。

<div id="dv" onmouseenter="console.log('进来')" onmouseleave="console.log('出去')">
   <div id="children"></div>
</div>

<div id="dv" onmouseover = "console.log('进来') οnmοuseleave="console.log("出去")">
    <div id="children"></div>
</div>

3、onblur/onfocus：表示得到焦点和失去焦点是触发的事件。

<div onblur="console.log('得到焦点')" onfocus="console.log('失去焦点')"></div>

4、onchange：一般用于下拉框select，当选项改变时就会触发到该事件。

<select onchange="console.log('已经修改')">
<option>1</option>
<option>2</option>
</select>