addEventListener, передать параметр обработчику

[pokk]

Есть динамическое число элементов, который должны выполнять изменение текста (по событию change) в разных ячейках таблицы.
Как для них сделать обработчики ?

1) можно ли сделать один обработчик а внутрь передать какой-нибудь индекс того какой элемент его вызывал ?
2) Как сделать переменное количество функций ?

[Nexus]

п.1

//устанавливаем обработчик на родителя всех элементов, для которых нужно слушать события
document.querySelector('#container').addEventListener('change',function(e){
    if(!e.target.classList.contains('target'))//Если элемент, на котором произошло событие не имеет класса target, то ничего не делаем
        return;
    
    const that=e.target;//Элемент, на котором произошло событие
});

[pokk]

В чем разница между?

select.addEventListener("change",SwitchDirect);

function SwitchDirect(){
	
	console.log(this);
	if(this.id==="Id_typeIn_0"){
		
	}	
	if(this.id==="Id_typeIn_1"){
		
	}
}

Все элементы создаются динамически, и на этапе создания я сразу к элементу добавляю addEventListener

[Nexus]

pokk, разница в том, что вы на каждый элемент будете вешать по обработчику события, а я повешаю только 1 обработчик.
Да и в вопросе у вас написано "можно ли сделать один обработчик", так что разница должна быть очевидна.

[рони]

В чем разница

класс проще проверить плюс не нужно навешивать на каждый select

[pokk]

Получается, что при создании элемента я присваиваю ему класс, а потом как вся таблица создана, нахожу все элементы с классом и вешаю обработчик на них всех.
Nexus,
"разница в том, что вы на каждый элемент будете вешать по обработчику события, а я повешаю только 1 обработчик."
Ну так вот в итоге будет тоже самое ? у вас будет 1 функция обработчик на всех элементах, и у меня будет тоже самое каждому элементу присвоена 1 функция и в итоге будет у всех элементов 1 обработчик, просто вы сразу массиву элементов присвоили обработчик, а у меня по штучно. Или не так ?

[Nexus]

pokk, не так.
У вас кол-во обработчиков, которое будет повешано на элементы будет равно кол-ву этих элементов, а у меня всего 1.
Почитайте про делегирование:
https://learn.javascript.ru/event-delegation

[laimas]

при создании элемента я присваиваю ему класс

И как по классу ориентироваться во множестве? Уж лучше тогда писать в атрибут ячеек индекс строки и индекс столбца. Конечно если в этом есть необходимость.

[pokk]

laimas, "Уж лучше тогда писать в атрибут ячеек индекс строки и индекс столбца" Это через какой параметр?

[Nexus]

pokk, в смысле "параметр"?
У элементов в html есть атрибуты, есть data-атрибуты.
Во вторые можно затолкать что угодно (главное, чтобы в строку конвертировалось) и при необходимости извлечь.
Про data-атрибуты:
https://developer.mozilla.org/ru/doc...ata_attributes
https://developer.mozilla.org/ru/doc...lement/dataset