Делаем добро вместе Детальнее

Урок №6 - Выбор элементов по классу

Урок №6 - Выбор элементов по классу

В видео уроке вы научитесь находить различные элементы в HTML документе по их классу. jQuery позволяет искать элементы несколькими способами и один из таких способов это отбор элементов по классу (class).

Видеоурок

jQuery позволяет выбирать элементы по их классу. Это позволяет выбрать сразу набор элементов, которые имеют некий общий класс. 


Создадим HTML разметку:

<span class="colored">Просто блок</span>
<p class="colored">Небольшой блок</p>
<div class="colored">Совсем не строчный элемент</div>

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


Пример jQuery:

var blocks = $(".colored");
blocks.hide(); // Скрыть все блоки
blocks.show(); // Показываем все элементы
blocks.css("color", "red"); // Установка цвета текста

Полученные элементы можно перебирать через циклы. Чтобы взять определенный элемент воспользуйтесь функцией: get(ИНДЕКС ЭЛЕМЕНТА).

Исходный код

Весь код будет доступен после подписки на проект!

Онлайн редактор кода

Загрузка...

Задание к уроку

Необходимо оформить подписку на проект, чтобы получить доступ ко всем домашним заданиям

Большое задание по курсу

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

Также стоит посмотреть

Изучение JavaScript для начинающих!
15 уроков
Изучение таск-менеджера Gulp 4
5 уроков
Создание приложения на React JS / Использование API
7 уроков
Уроки React Native для начинающих / Разработка приложения с нуля
11 уроков
Изучение React JS / Redux библиотеки
9 уроков
Создание динамического веб сайта
22 урока
Комментарии для сайта Cackle