2022-07-12 day05 第一小组 王鸣赫

目录

seitch....case效率后面是字面量（常量）

循环 4种

For循环

let 1=0 初始条件，i=0循环开始
i<10;判断条件，和初始条件配合循环
循环体
i++ 循环条件，每次循环体执行完毕
特殊写法

         for (let i = 0;i < 10; ) {
}  死循环

         for (let i = 0;; i++) {
} 死循环

length 长度 区分下标和长度
2.for in 语句 只能做便利操作

while 循环

3.while循环 do....while 条件循环
let a = 10;初始化条件
a<100 循环判断条件
打印输出 循环体
a++循环判断条件

 while                     for

初始化条件不好控制 /// 初始化单独的
循环条件不好控制 /// 每个for循环a++是隔离的
写函数返回值便于管理

do while 循环和while的区别
do while 无论是否成立走一次
while 不成立不走

点击查看代码 
 //    join()设置分隔符连接数组为一个字符串
                //    POP()删除最后一个元素
                //    sort 排序
                //   parseFloat整数转化小数
                //   paresinteresting。 把小数转成整数
                //      number 转成number类型
                //   string 其他类型转成字符串
                //  charAt()取出指定位置的字符
                //  indexof 判断字符是否存在，存在，
                //  replace tihuan
                //  split 根据-拆分字符串
                // substring(1,6)字符截取
                // Math:
                // ceil 向上取整
                // floor 向下取整
                // round四舍五入
                // random 生成0-1的随机数
                // getdate 返回日期的日
                // getHours 返回时间中的时
                // getMinutes
                // getSecinds
                // getTime 获取当前时间

Id  let div1= document.getElementById("div1")
       console.log(div1);
         新 根据选择器抓取一个元素
     let div= document.querySelector("div");
        console.log(div);
        根据选择器抓取全部
     let divs= document.querySelectorAll("div")
          console.log(div[0]);

事件

点击查看代码 
 //  ondblclick  双击事件
        //  onblur   失去焦点   文本框上
        //  onfocus  
        //  onchange   改变
        //  onload   加载

练习

点击查看代码 
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    用户名: <input type="text" id="username" onblur="w()">
    <span id="g">
      
    </span>




    <script>
        function w() {
            let d = document.querySelector("#username").value
            let e = document.getElementById("#g")
            if (d == "admin") {
              g.innerText="占用";
            }else{
                g.innerText= "可"; 
                
            }
        }

三级联动

Document
点击查看代码 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <select name="" id="sheng" onchange="Sheng()">
        <option>---请选择省---</option>
        <option value="jl">吉林</option>
        <option value="liao">辽宁</option>
    </select>
<select name="" id="shi" onchange="Shi()">
        <option>---请选择市---</option>
    </select>
<select name="" id="qu" onchange="">
        <option>---请选择区---</option> 
    </select>

<script>
    function CShi() {
        document.querySelector("#shi").innerHTML = "<option>---请选择市---</option>"
    }

    function CQu() {
        document.querySelector("#qu").innerHTML = "<option>---请选择区---</option>"
    }

    function Sheng() {
        CQu();
        let sheng = document.querySelector("#sheng").value;
        let shi = document.querySelector("#shi");

        
        if (sheng == "jl") {
            CShi();
            let html = shi.innerHTML;
            html += "<option value='cc'>长春</option><option value='sp'>四平</option>";
            shi.innerHTML = html;
        }
        
        if (sheng == "liao") {
            CShi();
            let html = shi.innerHTML;
            html += "<option value='dl'>大连</option><option value='sy'>沈阳</option>";
            shi.innerHTML = html;
        }
    }

    function Shi() {
        let shi = document.querySelector("#shi").value;
        let qu = document.querySelector("#qu");
        if (shi == "cc") {
            CQu();
            let html1 = qu.innerHTML;
            html1 += "<option value='cyq'>朝阳区</option><option value='edq'>二道区</option>";
            qu.innerHTML = html1;
        }
        if (shi == "sp") {
            CQu();
            let html1 = qu.innerHTML;
            html1 += "<option value='txq'>铁东区</option><option value='gzl'>公主岭</option>";
            qu.innerHTML = html1;
        }
        if (shi == "sy") {
            CQu();
            let html1 = qu.innerHTML;
            html1 += "<option value='cyq'>朝阳区</option><option value='edq'>二道区</option>";
            qu.innerHTML = html1;
        }
        if (shi == "dl") {
            CQu();
            let html1 = qu.innerHTML;
            html1 += "<option value='cyq'>朝阳区</option><option value='edq'>二道区</option>";
            qu.innerHTML = html1;
        }
    }
</script>



</body>
</html>
posted @ 2022-07-13 19:18  404notfond  阅读(13)  评论(0)    收藏  举报