Статья
Foops
20 Июня
Заключение + шпаргалка по основным методам jQuery
Итог курса
Вы изучили:
-
Основы jQuery: селекторы, манипуляции с DOM, события
-
Эффекты и анимации
-
Работа с формами и AJAX
-
Практические проекты: галерея, форма, фильтрация и сортировка
-
Советы по оптимизации и современные альтернативы
jQuery — мощный инструмент, упрощающий работу с JavaScript и браузерными особенностями.
Шпаргалка по основным методам jQuery
| Метод / Селектор | Описание | Пример |
|---|---|---|
$() |
Выбор элементов DOM | $('.class'), $('#id') |
.on(event, handler) |
Навесить обработчик события | $('#btn').on('click', fn) |
.off(event) |
Убрать обработчик | $('#btn').off('click') |
.addClass(name) |
Добавить CSS-класс | $('.item').addClass('active') |
.removeClass(name) |
Убрать CSS-класс | $('.item').removeClass('active') |
.toggleClass(name) |
Переключить CSS-класс | $('#box').toggleClass('hidden') |
.css(prop, val) |
Установить стиль CSS | $('#box').css('color', 'red') |
.html() / .text() |
Получить/установить HTML или текст | $('#div').html('<p>Hi</p>') |
.append(content) |
Добавить содержимое внутрь элемента | $('#list').append('<li>Item</li>') |
.fadeIn() / .fadeOut() |
Плавное появление/исчезновение | $('#img').fadeIn(400) |
.slideUp() / .slideDown() |
Скрыть/показать с анимацией | $('#menu').slideDown() |
.ajax() |
Общий AJAX-запрос | $.ajax({url:'data.php', success:fn}) |
.serialize() |
Сериализация формы для отправки | $('#form').serialize() |
.val() |
Получить/установить значение input | $('#input').val() |
Ресурсы для дальнейшего изучения
-
Бесплатные онлайн-курсы и видеоуроки на YouTube
-
Практика — лучший способ учиться, создавайте проекты и экспериментируйте!
9
