其他分享
首页 > 其他分享> > 2022-07-12 第一组 吕政洋 js(2)

2022-07-12 第一组 吕政洋 js(2)

作者:互联网

目录

1.循环结构

2.js内置函数

3.节点

4.事件

1.循环结构
四种循环结构:(1)for循环 (2)while循环 (3)for in语句 (4)do while循环
for循环

点击查看代码
 let arr = [10, 6, -8, 9, 4, -2, 7];
        function num(num1, arr) {
            let index = -1;
            for (let i = 0; i < 7; i++) {
                if (arr[i] == num1) {
                    index = i;
                }

            }
            return index;
        }

        console.log(num(-6, arr));

while循环

点击查看代码
  function count(){
        let year = 2022;
        let a = 10;
        
            
            while(a <= 100){
             console.log(a);
             a *= 1.1;
             year++;
            }
            return year+"年人数超过了100人,人数是:"+a;
        }
        console.log(count()); 

2.js内置函数:
Array
Global
String
Math
Date

3.节点:

//根据id抓取html元素
leta=document.getElementById("a") console.log(a)
//根据class抓取html元素
letas=document.getElementByclassName("as") console.log(as[0])
//根据tag抓取html元素
letas=document.getElementByTagName("as") console.log(as[0])

4.事件: 事件是当我们和html标签元素发生交互时产生的行为
onclick:单击事件
ondblclick:双击事件
onblur:失去焦点
onfocus:获得焦点
onchange:改变
onload:加载

心得体会:

今天学习了js的剩余部分,今天讲的东西都听懂了,老师带我们做了很多的练习,包括老师交代给我们一个任务,做出三级联动的程序,虽然有很多不是很懂的地方,但是我相信熟悉之后就没问题了。

点击查看代码
<!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 id="sheng" onchange="setShi()">
        <option>---请选择省---</option>
        <option value="jl">吉林省</option>
        <option value="ln">辽宁省</option>
    </select>
    

    <select id="shi" onchange="setQu()">
        <option>---请选择市---</option>

    </select>

    <select id="qu" onchange="">
        <option>---请选择区---</option>

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

    function zeroQu() {
        document.querySelector("#qu").innerHTML = "<option>---请选择区---</option>"
    }
      
function setShi() {
    zeroQu();
     let sheng = document.querySelector("#sheng").value;
     let shi = document.querySelector("#shi");
     console.log(shi);
     
     if(sheng == 'jl'){
        zeroShi();
        let html1 = shi.innerHTML;
        html1 += '<option value="cc">长春市</option><option value="sp">四平市</option>';
        shi.innerHTML = html1;
     }
     if(sheng == 'ln'){
        zeroShi();
        let html1 = shi.innerHTML;
        html1 += '<option value="sy">沈阳市</option><option value="dl">大连市</option>';
        shi.innerHTML = html1;

     }

     
  }

function setQu(){
        let shi = document.querySelector("#shi").value;

        let qu = document.querySelector("#qu");
        console.log(qu);
        if(shi == 'cc'){
            zeroQu();
            let html2 = qu.innerHTML;
            html2 += '<option value="ng">南关区</option><option value="ly">绿园区</option>'; 
            qu.innerHTML = html2; 
        }
        if(shi == 'sp'){
            zeroQu();
            let html2 = qu.innerHTML;
            html2 += '<option value="tx">铁西区</option><option value="td">铁东区</option>';
            qu.innerHTML = html2;
        }
        if(shi == 'sy'){
            zeroQu();
            let html2 = qu.innerHTML;
            html2 += '<option value="hp">和平区</option><option value="dd">大东区</option>'; 
            qu.innerHTML = html2; 
        }
        if(shi == 'dl'){
            zeroQu();
            let html2 = qu.innerHTML;
            html2 += '<option value="zs">中山区</option><option value="xg">西岗区</option>'; 
            qu.innerHTML = html2; 
        }


     }
   
  
    

    </script>
</body>
</html>

标签:12,qu,07,吕政洋,innerHTML,---,html2,let,shi
来源: https://www.cnblogs.com/lzy-1108/p/16475458.html