Табы на JavaScript (работаем с DOM деревом, событиями и циклами JS, меняем свойства HTML и CSS)

Подписаться 21 тыс.

Просмотров 3,2 тыс.

50% 1

В этом видео мы научимся создавать табы (вкладки) на чистом JavaScript. Для решения этой задачи мы будем работать с DOM деревом, чтобы динамически менять значения атрибутов HTML элементов.
Мы также будем использовать переменные, стрелочные функции, циклы и события JS.
Файлы проекта: t.me/stackdevr...
Мои Курсы:
JavaScript для начинающих: js001.ru
React для начинающих: react001.ru
Все мои курсы (+ исходные файлы): stackdev.ru
Подписывайся на соц сети:
Telegram: t.me/stackdevru
VK: vasilymur
Instagram: / vm_online
Мой блог о веб-разработке: stackdev.blog

Опубликовано:

6 окт 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 20

@Phoenix_coding Год назад

Новый выпуск. Ураа!

@stackdev Год назад

Спасибо!)

@Angel_Death_ 8 дней назад

Вот- вот... БлагоДарю !

@Serg_BY Год назад

Спасибо. Узнал для себя кое-что новое.

@Nepridumal__ 2 месяца назад

хорош, спасибо

@ИльяЛарских-х8ч 10 месяцев назад

Отличный пример! спасибо

@vipser13 Год назад

Очень все подробно и понятно!

@stackdev Год назад

Спасибо!

@vipser13 Год назад

@@stackdev вопрос, как отследить элемент который появляется от hover курсора. В инспекторе он исчезает и не получается его там увидеть.

@stackdev Год назад

@@vipser13 в инспекторе можно ставить галку напротив :hov (рядом с инпут поиск стилей) и получать элемент в состоянии hover

@ivanovserg8795 11 месяцев назад

А если не приводить tabPanels к массиву и не делать find, а сразу использовать селектор: const tabPanel = tabs.querySelector(`[aria-labelledby="${id}"]`);