С помощью селектора jQuery мы выбрали какие то элементы. Как теперь организовать их перебор в цикле? Есть пара вариантов.
Используем функцию $.each(func)
Разработчики не могли не заложить перебор по найденным элементам в библиотеку. Параметром должна быть функция, в которую передаётся два значения — номер элемента и ссылка на сам элемент DOM. Как пользоваться — см. пример.
|
1 2 3 4 5 6 7 8 9 10 11 12 |
jQuery("#nav span").each( function (index, elem) { if (jQuery(elem).hasClass('selected')) { alert('выбранный элемент найден, его № ' + index); jQuery(elem).addClass('found'); //прервать перебор можно, возвратив false return false; } else { alert('проверяем элемент № ' + index ); } } ); |
В примере мы перебираем элементы span в некотором контейнере #nav. На каждой итерации сообщаем номер элемента. В случае обнаружения SPAN.selected — сообщаем об этом, добавляем ему класс .found и прекращаем поиск.
Ручной перебор найденных селектором jQuery элементов
Возможно организовать перебор и без функции each. У нас есть выбранные элементы, мы знаем их кол-во — организуем цикл for по ним.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
var nav = jQuery("#nav span"); for(var k = 0; k < nav.length; k++) { var elem =- jQuery(nav).get(k); if (jQuery(elem).hasClass('selected')) { alert('выбранный элемент найден, его № ' + k); jQuery(elem).addClass('found'); //прервать перебор можно, прервав цикл break; } else { alert('проверяем элемент № ' + k ); } } |
Первый вариант изящнее, но есть один нюанс. Внутри функции перебора (в первом случае) переменная this будет иметь значение текущего элемента. Возможны и какие то другие коллизии локальных и глобальных переменных.
var elem =- jQuert(nav).get(k);
jQuert — не уверен, что это правильно
Да, это «очепятка». Спасибо за внимательность, поправил.