jQuery Синтаксис
За допомогою jQuery ви вибираєте (запитуєте) елементи HTML і виконуєте "дії" над ними.
jQuery Синтаксис
Синтаксис jQuery розроблено спеціально для вибору елементів HTML і виконання деяких дій з елементами.
Основний синтаксис: $(селектор).дія()
- Знак $ для визначення/доступу до jQuery
- (селектор) для "запиту (або пошуку)" HTML елементів
- Дія() jQuery, яка буде виконана з елементом(ами)
Приклади:
$(this).hide()
- приховує поточний елемент.
$("p").hide()
- приховує всі <p> елементи.
$(".test").hide()
- приховує всі елементи з class="test".
$("#test").hide()
- приховує елементи з id="test".
Чи знайомі ви з селекторами CSS?
jQuery використовує синтаксис CSS для вибору елементів. Ви дізнаєтеся більше про синтаксис селектора в наступному розділі цього посібника.
Порада. Якщо ви не знаєте CSS, ви можете прочитати CSS Підручник на нашому сайті W3Schools українською.
Подія готовності документа
Ви могли помітити, що всі методи jQuery в наших прикладах містяться в події готовності (ready event) документа:
$(document).ready(function(){
// Тут знаходяться методи jQuery...
});
Це робиться для того, щоб запобігти запуску будь-якого коду jQuery до того, як документ завершить завантаження (буде готовий).
Перш ніж працювати з ним, бажано дочекатися повного завантаження та готовності документа. Це також дозволяє розміщувати код JavaScript перед тілом документа, у розділі заголовка (між тегами <head>
та </head>
).
Ось кілька прикладів дій, які можуть бути невдалими, якщо методи запускаються до повного завантаження документа:
- Спроба приховати елемент, який ще не створено
- Спроба отримати розмір зображення, яке ще не завантажено
Підказка: команда jQuery також створила ще коротший метод для події готовності документа:
$(function(){
// Тут знаходяться методи jQuery...
});
Використовуйте синтаксис, який вам подобається. Ми вважаємо, що подію готовності документа легше зрозуміти під час читання коду.