大国工匠普拉斯金 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 Centos7 / PETGEM
  • ¥15 csmar数据进行spss描述性统计分析
  • ¥15 各位请问平行检验趋势图这样要怎么调整?说标准差差异太大了
  • ¥15 delphi webbrowser组件网页下拉菜单自动选择问题
  • ¥15 wpf界面一直接收PLC给过来的信号,导致UI界面操作起来会卡顿
  • ¥15 init i2c:2 freq:100000[MAIXPY]: find ov2640[MAIXPY]: find ov sensor是main文件哪里有问题吗
  • ¥15 运动想象脑电信号数据集.vhdr
  • ¥15 三因素重复测量数据R语句编写,不存在交互作用
  • ¥15 微信会员卡等级和折扣规则
  • ¥15 微信公众平台自制会员卡可以通过收款码收款码收款进行自动积分吗