js使用基础总结（简单封装，事件，foreach 原生js写法）

1.forEach的灵活使用

【注意】数组专用的-----遍历函数方法相当于for循环

语法结构

arr.forEach(function(obj,index){
obj---数组中的具体数据，可以是基本数据类型，也可以是获取的标签
index---数据或标签的索引})

2.switch的使用

【注意】

1.判断相当于是===的判断（精确值的判断）

2.判断机制是循环的底层，所以要使用break结尾

    let num = "2"
    switch (num) {
        case 1:
            alert('ok')
            break;
        case 2:
            alert('ook')
            break;
        default:
            alert('nook')
            break;
    }
//结果是nook

3.回调函数和普通函数

1.运动框架----当前的函数执行完运动后，再执行的操作

 box.onmouseout = function () {
        startMove(this,{"height":"20px"},500,"bounceOut",function(){
            startMove(box,{"width":"100px"},500,"bounceOut")
        })

2.普通函数---自定义函数---内置函数

4.拼接和原生js生成的区别

拼接的内容永远是字符串---通过innerHTML添加到标签中，多次添加相当于替代

<!-- 拼接 -->
<ul class="text">
</ul>
<script>
    // 获取标签
    let text=document.querySelector('.text')
    let str="<li>"
        str+=`${"好好学习"}`
        str+="</li>"
        // 传输内容
        text.innerHTML=str
</script>

自动生成的标签是一个字符串---通过object对象---通过appendChild()添加，多次添加相等于累加

<!-- js原生 -->
<ul class="text">

</ul>

<script>
  let  arr=[11,22,33,44]
    let text=document.querySelector('.text')
    arr.forEach(function(obj,index) {
        //生成标签
        let li=document.createElement('li')
        // 生成文字
        li.innerHTML=obj
         // 把生成和装载完毕的li添加到ul中
        text.appendChild(li)

    });
</script>

5.遍历数据结构中的判断需求

 <ul class="list girl">

    </ul>
    <ul class="list boy">

    </ul>
    <script>
        let list = document.querySelector(".list")
        let dataArray = [