关于常见的一个问题,涉及到闭包、作用域等问题,节点列表点击打印对应索引的问题
一、块级作用域下,最简洁的写法
var list = document.getElementById("list"), childs = list.getElementsByTagName("li"); for(let i = 0; i<childs.length; i++){ childs[i].onclick=function(){ console.log(i) } }
二、通过闭包,隔离各个i的作用域
var list = document.getElementById("list"), childs = list.getElementsByTagName("li"); for(var i = 0; i<childs.length; i++){ (function(i){ childs[i].onclick=function(){ console.log(i) } })(i) }
三、通过给节点设置index属性,然后在获取该属性(设置中间属性搭桥)
var list = document.getElementById("list"), childs = list.getElementsByTagName("li"); for(var i = 0; i<childs.length; i++){ childs[i].setAttribute("index",i); childs[i].onclick=function(){ console.log(this.getAttribute("index")) } }