addEventListener usando um loop For e passando valores

Ao usar um loop for para adicionar ouvintes de eventos a vários objetos, o último objeto geralmente se torna O destino para todas as realocações do listener. Este artigo abordará esse problema e fornecerá um código corrigido usando encerramentos:

Visão geral do problema:

Tentando adicionar ouvintes de eventos a vários objetos usando um loop, mas em última análise, todos os ouvintes têm como alvo o mesmo objeto (o último).

Código fixo:

o fechamento é uma forma de evitar esse tipo de problema. O código modificado é o seguinte:

// 函数在点击时运行：
function makeItHappen(elem, elem2) {
    var el = document.getElementById(elem);
    el.style.backgroundColor = "red";
    var el2 = document.getElementById(elem2);
    el2.style.backgroundColor = "blue";
}

// 自动加载函数以添加侦听器：
var elem = document.getElementsByClassName("triggerClass");

for (var i = 0; i