如何为JavaScript中的多个元素分配事件处理程序？

Question

我知道如何使用jQuery，我知道如何使用事件委托。但是你怎么用普通的JavaScript做到这一点？

例如，如何将事件处理程序分配给一堆li s？

我看到var li = document.querySelectorAll('li');。返回类似数组的东西。你只是循环并分配处理程序？我觉得必须有更好的方法。如果没有，那么循环类似数组的东西的最佳方法是什么（以及类似数组的东西是什么？）？

Answer 1

是的，你应该遍历集合并单独分配处理程序。 jQuery也在幕后做这件事。

querySelectorAll返回NodeList，这是一个类似数组的对象。

要循环列表，您可以使用for循环：

var list = document.querySelectorAll('li'),
    l = list.length,
    li;

for (var i = 0; i < l; i++) {
   li = list.item(i);
   // ...
} 

或使用forEach方法：

[].forEach.call(document.querySelectorAll('li'), function(li) {
    // ...
});