js关于正确获取索引的方法

利用 改变this 指向、 闭包(IIFE)、ES6 中的 let 关键字即可

<ul type="disc" id="list">
    <li>1关于 获取索引的问题</li>
    <li>2关于 获取索引的问题</li>
    <li>3关于 获取索引的问题</li>
    <li>4关于 获取索引的问题</li>
    <li>5关于 获取索引的问题</li>
    <li>6关于 获取索引的问题</li>
</ul>

<script>
    // 获取索引的问题
    var lis = document.getElementsByTagName("li");
    console.log(lis);


    // 利用  this 指向获取索引的问题
    // for(var i=0;i<lis.length;i++){
    //     lis[i].index= i
    //     lis[i].οnclick=function(){
    //         console.log("当前对应的 li 的索引为",this.index);
    //     }
    // }


    // 利用闭包实现正确获取索引的问题
    // for(var i = 0;i<lis.length;i++){
    //     (function(j){
    //         lis[j].onclick = function(){
    //             console.log("当前对应的 li 的索引为",j);
    //         }
    //     })(i)
    // } 

    // 利用 es 6  的 let  关键字坚解决正确获取索引的问题
    for (let i = 0; i < lis.length; i++) {
        lis[i].onclick = function () {
            console.log("当前对应的 li 的索引为", i);
        }
    }

</script>

版权声明:本文为YCHH1原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。