В этом решении использовался цикл for для прикрепления слушателей событий ко всем потомкам родителя (или массива, содержащего HTML-элементы). Вот как выглядел его код:

let theParent = document.querySelector("#theDude");

for (let i = 0; i < theParent.children.length; i++) {

let childElement = theParent.children[i];

childElement.addEventListener('click', doSomething, false);

}

function doSomething(e) {

let clickedItem = e.target.id;

console.log("Hello " + clickedItem);

}

В итоге этот подход позволял прослушивать события щелчка непосредственно в потомках. Единственным, что мне пришлось прописывать вручную, был один вызов слушателя событий, который параметризировался для соответствующего дочернего элемента в зависимости от того, где в цикле находился код:

childElement.addEventListener('click', doSomething, false);

Причина несостоятельности этого подхода в том, что каждый дочерний элемент имеет связанный с ним слушатель событий. Это возвращает нас к вопросу об эффективности, которая в данном случае страдает от неоправданных затрат памяти.

Если у вас возникнет ситуация, в которой элементы будут разбросаны по DOM, не имея рядом общего родителя, использование этого подхода для массива HTML-элементов будет неплохим способом решения проблемы MEEC.