闭包注册点击事件

最新推荐文章于 2022-10-20 19:29:19 发布

HaiRong_21

最新推荐文章于 2022-10-20 19:29:19 发布

阅读量118

点赞数

文章标签： js

本文链接：https://blog.csdn.net/HaiRong_21/article/details/109246662

版权

<body>
    <ul class="nav">
        <li>榴莲</li>
        <li>臭豆腐</li>
        <li>鲱鱼罐头</li>
        <li>大猪蹄子</li>
    </ul>
    <script>
        //  闭包应用-点击li输出当前li的索引号
        //1,我们可以利用动态添加属性的方法
        let lis = document.querySelector('.nav').querySelectorAll('li');
        for(let i=0;i<lis.length;i++){
            lis[i].index=i;
            lis[i].onclick = function(){
                // console.log(i);
                console.log(this.index);
            }
        }
        //2，利用闭包的方式得到当前li的索引号
        for(let k=0;k<lis.length;k++){
            //利用for 循环创建四个立即执行函数
            //立即执行函数也称为小闭包，因为立即执行函数里面的任何一个函数都可以使用它的参数变量
            (function(k){
                // console.log(k);
                lis[k].onclick = function(){
                    console.log(k);
                }
            })(k)
        }
    </script>
</body>

在这里插入图片描述

HaiRong_21

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
闭包注册点击事件

<body> <ul class="nav"> <li>榴莲</li> <li>臭豆腐</li> <li>鲱鱼罐头</li> <li>大猪蹄子</li> </ul> <script> // 闭包应用-点击li输出当前li的索引号 //1,我们可以
复制链接

扫一扫