Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Определение свойств массиву элементов (https://javascript.ru/forum/events/75479-opredelenie-svojjstv-massivu-ehlementov.html)

alexkirsanov850@gmail.com 13.10.2018 23:46

Определение свойств массиву элементов
 
Доброго времени суток!

Не могу понять, почему не работает нижеследующий код?
var elems = document.getElementsByClassName('anchor');
        
        function addOnWheel(index, handler) {
            if (index < elems.length) {
                elems[index].addEventListener('wheel', handler, false);
            }
        }
        
        for (var i = 0; i < elems.length; i++) {
            addOnWheel(i, function(e) {
                elems[i].style.backgroundColor = 'green';
            })
        }


В тоже время, замечательно работает следующий:

var elems = document.getElementsByClassName('anchor');
        
        function addOnWheel(index, handler) {
            if (index < elems.length) {
                elems[index].addEventListener('wheel', handler, false);
            }
        }
        
//        for (var i = 0; i < elems.length; i++) {
            addOnWheel(0, function(e) {
                elems[0].style.backgroundColor = 'green';
            });
            addOnWheel(1, function(e) {
                elems[1].style.backgroundColor = 'green';
            });

//        }


т/е в цикле не работает
в ручную работает

В чем разница?

рони 13.10.2018 23:54

alexkirsanov850@gmail.com,
Пожалуйста, отформатируйте свой код!

Для этого его можно заключить в специальные теги: js/css/html и т.п., например:
[js]
... ваш код...
[/js]


О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting.

j0hnik 14.10.2018 00:04

var elems = document.getElementsByClassName('anchor');
[].forEach.call(elems, function(el){
	el.addEventListener('wheel', function(){
		el.style.backgroundColor = 'green';
	}, false);
});

рони 14.10.2018 00:06

Цитата:

Сообщение от alexkirsanov850@gmail.com
В чем разница?

в том что i равно elems.length!!! когда сработает фунция handler
Пример ошибочного использования

Malleys 14.10.2018 00:18

Но если всё-таки говорить о первом примере (который не работает), то там в цикле при объявлении переменной вместо for (var i = 0; i < elems.length; i++) { нужно for (let i = 0; i < elems.length; i++) {


Часовой пояс GMT +3, время: 21:03.