大国工匠普拉斯金 2021-10-12 18:12 采纳率: 75%
浏览 37
已结题

使用双for循环给div的每个子元素setattribute,index属性为什么只能给最后一个li添加呢?


<style>
    div {
        width: 400px;
        height: 400px;
        background-color: red;
    }
</style>

<body>
    <div></div>
</body>
<script>
    var div = document.querySelector('div');

    for (let i = 0; i < 4; i++) {
        var li = document.createElement('li');
        div.appendChild(li);
        li.addEventListener('click', function() {
            for (let i = 0; i < 4; i++) {
                li.setAttribute('index', i);
            }
        });
    }
</script>

img

正确的写法我知道,这是我在做轮播图练习的时候无意中写出来的,不太理解为什么第二个for循环中li.setattribute('index',i)为什么只能给最后一个li添加index属性 而不是给每一个li全部都加上index呢?

  • 写回答

2条回答 默认 最新

  • Zarek⠀ 2021-10-12 18:28
    关注

    其实还是闭包问题,你将图片这里的li改成this就好了,因为第一层循环之后li变量已经变成最后一个li了,所以无论你点击哪个,其实点击函数接受到的li都是第四个li的变量,所以相对于都在点击第四个,但是改为this之后,就不会了,this会为你记录上下文。有帮助麻烦点个采纳【本回答右上角】

    img

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题?

问题事件

  • 系统已结题 10月20日
  • 已采纳回答 10月12日
  • 创建了问题 10月12日

悬赏问题

  • ¥15 HFSS 中的 H 场图与 MATLAB 中绘制的 B1 场 部分对应不上
  • ¥15 如何在scanpy上做差异基因和通路富集?
  • ¥20 关于#硬件工程#的问题,请各位专家解答!
  • ¥15 关于#matlab#的问题:期望的系统闭环传递函数为G(s)=wn^2/s^2+2¢wn+wn^2阻尼系数¢=0.707,使系统具有较小的超调量
  • ¥15 FLUENT如何实现在堆积颗粒的上表面加载高斯热源
  • ¥30 截图中的mathematics程序转换成matlab
  • ¥15 动力学代码报错,维度不匹配
  • ¥15 Power query添加列问题
  • ¥50 Kubernetes&Fission&Eleasticsearch
  • ¥15 報錯:Person is not mapped,如何解決?