Що таке jQuery?
jQuery — це популярна JavaScript-бібліотека, яка спрощує роботу з HTML-документами, DOM-деревом, подіями, анімаціями та AJAX-запитами. Вона дозволяє писати менше коду для виконання складних задач, що значно полегшує розробку веб-додатків.
Основні можливості jQuery
- Спрощене маніпулювання DOM
- Додає, змінює або видаляє елементи HTML-сторінки.
- Використовує CSS-селектори для доступу до елементів.
- Наприклад, зміна тексту у
<div>:$("#myDiv").text("Новий текст");
- Робота з подіями
- Легке додавання обробників подій (
click,hover,keyupтощо). - Приклад:
$("#myButton").click(function() { alert("Кнопка натиснута!"); });
- Легке додавання обробників подій (
- Анімації та ефекти
- Додає плавні ефекти (
fadeIn(),fadeOut(),slideUp(),slideDown()тощо). - Приклад:
$("#box").fadeOut(1000);
- Додає плавні ефекти (
- AJAX-запити
- Відправка та отримання даних без перезавантаження сторінки.
- Приклад завантаження JSON-даних:
$.get("data.json", function(data) { console.log(data); });
- Маніпуляція стилями
- Додає та змінює CSS-класи.
- Наприклад:
$("#box").css("background-color", "blue");
- Ланцюжкова структура (Chaining)
- Дозволяє виконувати кілька операцій у одному виклику.
- Наприклад:
$("#box").slideUp(500).slideDown(500).fadeOut(500);
Приклад використання jQuery
<!DOCTYPE html>
<html lang="uk">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>jQuery Приклад</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function() {
$("#myButton").click(function() {
$("#myText").text("Привіт, jQuery!");
});
});
</script>
</head>
<body>
<p id="myText">Натисни кнопку</p>
<button id="myButton">Змінити текст</button>
</body>
</html>
Чи варто використовувати jQuery у 2024 році?
⚠️ jQuery втрачає популярність через те, що:
- Сучасні браузери мають вбудовані можливості для роботи з DOM та AJAX.
- Використання Vanilla JavaScript (ES6+) стало зручнішим.
- Фреймворки типу Vue.js, React, Angular замінили jQuery у складних веб-додатках.
Але jQuery все ще використовується, особливо у старих проєктах та CMS (наприклад, WordPress), де він є вбудованим.
Висновок
jQuery — це зручна бібліотека, яка спрощує роботу з JavaScript, але в сучасній веб-розробці її використовують рідше через нові стандарти JavaScript та фреймворки.