在多个事件绑定时,用for-in遍历会报错,用for循环就不会出错,怎么解决

<script>
    let btns = document.querySelectorAll("button");
    let divs = document.querySelectorAll("div");
    for (let i in btns) {
        btns[i].addEventListener("click", function () {
            for (const iterator of divs) {
                iterator.style.display = "none";
            }
            divs[i].style.display = "block";
        });
    }
</script>

可以用for of,forEach,for循环。
for in 把数组的非索引属性给遍历出来了 譬如length,btns[i]就不是dom对象了

你for in里面的 i 代表的是btns下面的子元素不是下标,直接 i.addEventListener就行了

//for in 主要用于遍历对象的,不使用与遍历数组,

        //for of 可以用来遍历数组的对象,字符串,set ,map ,generator

        let obj = {

            name:'wang',

            type:'suai',

            content:'qianduan'

        }

        for(Key in obj){

            //key 就是name等,obj[key]是内容,里面的每一项是key

            console.log('key:' + Key + '...' + 'value:' + obj[Key]);

        }
        //key:name...value:wang
        //key:type...value:suai
        //key:content...value:qianduan

        

        let arr = ['fan','2','你好'];

        //for of是循环的每一项 下列item就是arr的每一项内容

        for(let item of arr){

            console.log(item);

        }
//fan
 //2

感觉主要记住for...in是遍历对象,json格式的对象用这个最方便,for...of是遍历数组等

自己写的一些总结可以看一下:http://www.wangcanghai.cn/detailes?id=601b706524fc4a133c24648c#toc26