Реалізація Функціоналу Фільтрації

Мета

Нарешті, останній крок — додати функціональність фільтрації статей за темою, яка буде реалізована за допомогою JavaScript.

Можливий запит

Чи можете ви реалізувати функцію фільтрації статей за темою за допомогою HTML-кнопок і JavaScript?

Результат

Файл index.html

• Додаємо блок nav у header, де будуть розміщені кнопки фільтрації;
• Кожній статті надаємо атрибут data-category із відповідним значенням теми;
• Додаємо посилання на файл index.js перед закриваючим тегом body.

Файл index.css
Додаємо стилі, щоб кнопки фільтрації виглядали привабливо.

Файл index.js
Вставляємо скрипт, який реалізує логіку фільтрації.

Усе це нам порадив зробити ChatGPT. Ми дотрималися його інструкцій.

Стан вебсайту

Відеоінструкція

Ось і все. Ви впоралися. Це ваш повністю готовий, функціональний вебсайт. Чудова робота!