从for循环中调用增量器

时间:2012-08-18 05:56:06

标签: javascript loops increment getelementsbytagname

我在这个循环中调用增量器i时遇到了一些麻烦,以便识别我当前的元素。 Firebug给了我错误"li[i].addEventListener is not a function"

document.addEventListener("DOMContentLoaded", function(){

var li = document.getElementsByTagName('li');

for(var i in li){
    li[i].addEventListener('click', function(){
        alert('yey');
    });
    }
});

奇怪的是,如果我打电话

alert(li[i].getAttribute('id')

我得到了警告,但如果我再使用

var id=li[i].getAttribute('id');
document.getElementById(id).addEventListener(blah);

我得到相同的“不是函数”错误。这是一个for循环的东西吗?我注意到alert(i);在循环结束时调用了一些额外的东西,所以有没有不同的方法在for循环中使用增量器?顺便说一句,我使用的列表是:

<ul>
    <li id=pomp>
        stuff
    </li>
    <li id=and>
        and
    </li>
    <li id=circumstance>
        things
    </li>
</ul>

3 个答案:

答案 0 :(得分:3)

这就是为什么你必须避免使用for in循环

for(var i=0;i<li.length;i++){
    li[i].addEventListener('click', function(){
        alert('yey');
    });
}

当你使用in时,i不是你想象的整数,而是它是nodelist的一个属性。

答案 1 :(得分:0)

正如@lbu指出的那样,你应该使用for (decl; test; inc)来遍历一个数组。

但是,这也是使用委派的好地方,因为每个<li>必须是<ul>的直接后代,您可以将事件处理程序放在那里,并为您的浏览器减少工作量:

var ul = document.getElementsByTagName('ul');

for (var i = 0, n = ul.length; i < n; ++i) {
    ul[i].addEventListener('click', function(ev) {
        alert(ev.target.id);
    });
}

请参阅http://jsfiddle.net/2mk3w/

答案 2 :(得分:-1)

以这种方式试试

for(var i in li){
    i.addEventListener('click', function(){
        alert('yey');
    });
    }
});