js在for中的事件无法调用循环变量i的解决方法
程序员文章站
2022-03-27 17:11:20
...
在for循环中的事件里面会发现无法使用循环变量i。
<div>
<span>1</span>
</div>
<div>
<span>2</span>
</div>
<div>
<span>3</span>
</div>
<div>
<span>4</span>
</div>
<div>
<span>5</span>
</div>
for (var i = 0; i < div.length; i++) {
div[i].addEventListener('click', function () {
var html = span[i].innerHTML;
console.log(html);
})
}
这时,我们可以给事件的对象div用setAttribute设置一个自定义值,然后在事件中用getAttribute进行调用来取代i。
for (var i = 0; i < div.length; i++) {
div[i].setAttribute('index', i);
div[i].addEventListener('click', function () {
var index = this.getAttribute('index');
var html = span[index].innerHTML;
console.log(html);
})