Js работа со стилями, className, classList, add, remove, toggle, добавление удаление и переключение
Vložit
- čas přidán 17. 04. 2020
- Работа с классами удаление, добавления, переключение стилей, так же рассмотрим как добавлять стили через javascript
Спасибо что смотрите, не забывайте ставить лайк, подписаться и оставить коммент под видео, так вы благодарите меня и мотивируете снимать новое полезное видео.
CZcams: / mariodev
VK: mario2020
instagram: / mario_ahi
facebook / mariodevelope
#style #toggle #add #remove #javascript #css #html #marioDev #programming #frontend
Марио, это очень полезный и важный урок! Это основа оживления сайтов. Рада, что ты его выпустил. Спасибо. И кстати, пустил бы ты этот урок в раскрутку, чтобы у других учеников была возможность найти этот урок.
Идеально, чтобы перейти от изучения css к js. очень полезный урок!
Спасибо! Очень полезный урок! Доходчиво выкладываете!!!
Недавно наткнулась на ваш канал, теперь смотрю одно видео за другим. Очень много полезной информации, порой уроки даже более информативны, чем у раскрученных каналов. Продолжайте заниматься этим, у вас хорошо получается!
PS для новичка это просто находка, потому что пока трудно ориентироваться в море информации. Спасибо за ваш труд!
спасибо) очень приятно что мой канал полезен и приносит пользу
Только начал изучать js и стараюсь понять взаимодействия с html, css. Ваш урок многое прояснил, очень доступно и понятно, спасибо!
Спасибо большое за подробное объяснение!!!
Спасибо, очень полезно!
Спасибо, очень просто и познавательно. Мне очень помог Ваш материал в верстке собственного проекта
Отличный урок ! Спасибо!
Посмотрел видео 10 перед твоим про toggle, всё не то рассказывают, ты же просто и доступно объяснил, стало ясно и понятно. Спасибо.
спасибо за урок, интересно
Вы так подробно объясняете, что даже самый тупой поймет) Спасибо за ваши уроки!)
- Да?
- Да!)))
p.s. Спасибо!
Это лучшее объяснение которое я находил!))
Спасибо тебе!!! Очень крутое и полезное видео
Вчера гуглил всю эту тему, а сегодня ютуб подкинул твоё видео в рекомендации. Спасибо за полезный контент) Всё доходчиво и понятно.
Спасибо, с вашей помощью сделал список с переключением иконок при открытии-закрытии списка. Лайк! Метод toggle мне больше понравился.
Отличное объяснение!
Спасибо большое!!!
Спасибо, то что искал
очень долго пытался найти что то подобное. я в голове имею представление как осуществить но из за того что не работал с js просто путаюсь в синтаксисе да и вообще по большому счёту не знаю его, но теперь всё понятно. спасибо!
Спасибо, помог.
Спасибо большое вам! Вот только можно в следующих видео экран сделать поближе или покрупнее, а то смотриш и не видишь что вы пишите там.
дякую за контент дуже помагає
спасибо
Почему-то ваш способ не работает. У меня JS не воспринимает двоеточия и скобки, указывая на ошибку синтаксиса, хотя я все точно так же прописал и проверил.
Та ж проблема
Если мы присваиваем что-то elem.className, то это заменяет всю строку с классами. Иногда это то, что нам нужно, но часто мы хотим добавить/удалить один класс./На learn js так написано
Привет) спасибо за видео, а что за расширение стоит, которое подсвечивает селектор? 6:07
JS Parameter Annotations --- ctrl+c)))
@@centradude493 Спасибо
@@centradude493 что-то не работает он
Спасибо за видео.
07:16 document.querySelector(selectors: '.list')
не оч понятно, selectors: - это плагин какой-то Вам добавил?
document.querySelector('.list') же вроде надо? Непонятно.
это VS code автоматом подставляет, это просто подсказка - не является частью кода
Всё очень здорово. Спасибо!
Но про className так не чего и не услышал.
className просто читает класс элемента и так же перезаписывает его например document.body.className = 'wrap', у className есть старший брат, classList, лучше пользоваться им, тоже самое будет document.body.classList.add('wrap'), но у classList есть много других методов например toggle, remove, и другие
@@MarioDev Спасибо. Про читал уже про это свойства.
у меня вопрос, допустим я скачал коллекцию анимаций, подключил этот файл и анимацию к элементу по классу()она работает - элемент анимирован, но если я этот же класс анимации добавляю к элементу через JS класслист.тоглкласс, то он не анимируется, почему??? класс подключается, в консоли это видно, но анимация не происходит
скинь код
@@MarioDev спс, я уже разобрался с проблемой)
Sir make a video on add to cart in JavaScript......sir I have a question how can we make product inside product I mean when I click on addto cart button it displays another addto cart button same like 9 times how can we make like this
Краткая запись в Emmet:
ul.list>li.item{Item $}*4
то же самое, что:
Item 1
Item 2
Item 3
Item 4
Спасибо большое. А как сделать чтобы при нажатии на один элемент из ul, у остальных удалялись классы? У нажатого появлялся, а у остальных удалялся
у всего списка в цикле удаляешь класс active, у нажатого элемента добавляешь
@@MarioDev извините, а можно пример?
в 2024 году твой код не работает в курсе ?
почему у меня тогл не работает? то есть класс просто добавляется и все.
const iconMenu = document.querySelector('.menu__icon');
const menuBody = document.querySelector('.menu__body');
iconMenu.addEventListener("click", function (e) {
menuBody.classList.toggle('_active');
});
разобрался. .menu__body _active перекрывал иконку). видео крутое. подписался
+++
Спасибо за уроки, не подскажите почему выдает ошибку "Uncaught SyntaxError missing ) after argument list" Код проверил все так же как у вас ссылка на скрин prnt.sc/ut2uwo
тоже самое
Текст мелкий. С телефона особенно код плохо видно.