addEventListener For ループの使用と値の受け渡し

for ループを使用してイベント リスナーを複数のオブジェクトに追加すると、最後のオブジェクトが次のようになります。すべてのリスナーの再配置のターゲット。この記事ではこの問題に対処し、クロージャを使用した修正コードを提供します:

問題の概要:

ループを使用して複数のオブジェクトにイベント リスナーを追加しようとしていますが、最終的には、すべてのリスナーが同じオブジェクト (最後のオブジェクト) をターゲットとします。

修正コード:

クロージャは、この種の問題を防ぐ方法です。変更されたコードは次のとおりです:

// 函数在点击时运行：
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