Ще одне концепт-відео! Це "лише одне з того", що потрібно зрозуміти у jQuery. Це насправді трохи унікально для jQuery, оскільки інші популярні бібліотеки JavaScript у минулому не робили цього таким чином.
Ми вже трохи охопили селектори. Наприклад, ви вже знаєте, що $("p")буде виділено всі абзаци на сторінці. Не тільки перший чи якийсь випадковий, усі вони. Ви легко можете собі уявити, що таких сторінок може бути багато. А тепер уявіть, що відбувається, коли ви це робите:
$("p").hide();Всі вони приховуються, чи не так? Правильно. Не перший чи якийсь випадковий, усі. Ця неявна ітерація . За кулісами jQuery автоматично перебирає весь набір знайдених елементів і запускає на них вибраний вами метод. Для цього нам буквально не потрібно писати цикл. Здається, досить очевидним, якщо ви вводите JavaScript, є jQuery, але багато бібліотек раніше вимагали, щоб ви самі перебирали колекції елементів.
Якщо ви хочете, ви все одно можете написати цикл самостійно. Можливо, це могло б виглядати так, використовуючи циклічні методи jQuery:
$("p").each(function() ( $(this).hide(); ));Це приблизно те саме. Не обов’язково, але ви могли б. Це явна ітерація .
Іноді вам потрібно зробити явну ітерацію. По суті, якщо нам потрібно отримати доступ до значення thisта зробити з ним щось особливе, нам знадобиться наша власна конструкція циклу для роботи.
Прикладом у цьому скрінкасті було підрахунок символів у елементах списку та додавання цього до кінця рядка. Для цього нам знадобиться явна ітерація.
Дивіться Ручку 4b53b9f55662d0d26339e18277500eee Кріса Койєра (@chriscoyier) на CodePen
Тут ми використовували метод jQuery each (), який ідеально підходить для того, що нам потрібно. Корисний біт, який він робить для нас, - це дає нам нульовий індексований лічильник кожної ітерації, до якої ми можемо отримати доступ, якщо це необхідно.
$(".there-are-three-of-me").each(function(i) ( console.log(i); )); // 0 // 1 // 2