Js работа со стилями, className, classList, add, remove, toggle, добавление удаление и переключение

แชร์
ฝัง
  • เผยแพร่เมื่อ 11 ม.ค. 2025

ความคิดเห็น • 55

  • @zhenia14
    @zhenia14 2 ปีที่แล้ว

    Посмотрел видео 10 перед твоим про toggle, всё не то рассказывают, ты же просто и доступно объяснил, стало ясно и понятно. Спасибо.

  • @polskolg
    @polskolg 4 ปีที่แล้ว +3

    Недавно наткнулась на ваш канал, теперь смотрю одно видео за другим. Очень много полезной информации, порой уроки даже более информативны, чем у раскрученных каналов. Продолжайте заниматься этим, у вас хорошо получается!
    PS для новичка это просто находка, потому что пока трудно ориентироваться в море информации. Спасибо за ваш труд!

    • @MarioDev
      @MarioDev  4 ปีที่แล้ว

      спасибо) очень приятно что мой канал полезен и приносит пользу

  • @frontenddeveloper660
    @frontenddeveloper660 4 ปีที่แล้ว +12

    Марио, это очень полезный и важный урок! Это основа оживления сайтов. Рада, что ты его выпустил. Спасибо. И кстати, пустил бы ты этот урок в раскрутку, чтобы у других учеников была возможность найти этот урок.

    • @aqreels25
      @aqreels25 หลายเดือนก่อน

      Как успехи спустя 4 года?

  • @woodenproduction21
    @woodenproduction21 3 ปีที่แล้ว +1

    Вы так подробно объясняете, что даже самый тупой поймет) Спасибо за ваши уроки!)

  • @olgapolskolg1112
    @olgapolskolg1112 3 ปีที่แล้ว +1

    Идеально, чтобы перейти от изучения css к js. очень полезный урок!

  • @АлександрРадько-ц4з
    @АлександрРадько-ц4з 2 ปีที่แล้ว

    Спасибо, с вашей помощью сделал список с переключением иконок при открытии-закрытии списка. Лайк! Метод toggle мне больше понравился.

  • @black_light
    @black_light 2 ปีที่แล้ว

    Вчера гуглил всю эту тему, а сегодня ютуб подкинул твоё видео в рекомендации. Спасибо за полезный контент) Всё доходчиво и понятно.

  • @maks6321
    @maks6321 2 ปีที่แล้ว

    Только начал изучать js и стараюсь понять взаимодействия с html, css. Ваш урок многое прояснил, очень доступно и понятно, спасибо!

    • @aqreels25
      @aqreels25 หลายเดือนก่อน

      Как у тебя успехи спустя 2 года?

  • @АртемЧагочкин-ь1ж
    @АртемЧагочкин-ь1ж 2 ปีที่แล้ว

    очень долго пытался найти что то подобное. я в голове имею представление как осуществить но из за того что не работал с js просто путаюсь в синтаксисе да и вообще по большому счёту не знаю его, но теперь всё понятно. спасибо!

  • @АндрейНовицкий-т9е
    @АндрейНовицкий-т9е 2 ปีที่แล้ว

    Спасибо, очень просто и познавательно. Мне очень помог Ваш материал в верстке собственного проекта

  • @maks6321
    @maks6321 2 ปีที่แล้ว

    Это лучшее объяснение которое я находил!))

  • @ТетянаЛегка-ч6л
    @ТетянаЛегка-ч6л 3 ปีที่แล้ว

    Спасибо! Очень полезный урок! Доходчиво выкладываете!!!

  • @Максимда-л8ы
    @Максимда-л8ы 2 ปีที่แล้ว

    спасибо за урок, интересно

  • @cy66a
    @cy66a 4 ปีที่แล้ว +3

    - Да?
    - Да!)))
    p.s. Спасибо!

  • @143-z4m
    @143-z4m 3 ปีที่แล้ว

    Спасибо большое за подробное объяснение!!!

  • @antonzhade5482
    @antonzhade5482 4 ปีที่แล้ว +3

    Спасибо, очень полезно!

  • @juliaweinstein3133
    @juliaweinstein3133 2 ปีที่แล้ว

    Спасибо тебе!!! Очень крутое и полезное видео

  • @ФаррухРахимов-ы4о
    @ФаррухРахимов-ы4о ปีที่แล้ว

    Спасибо большое вам! Вот только можно в следующих видео экран сделать поближе или покрупнее, а то смотриш и не видишь что вы пишите там.

  • @deterkot
    @deterkot 2 ปีที่แล้ว

    дякую за контент дуже помагає

  • @artyrdanilov2791
    @artyrdanilov2791 4 ปีที่แล้ว

    Отличный урок ! Спасибо!

  • @sencorio
    @sencorio 2 ปีที่แล้ว

    Отличное объяснение!

  • @deanwichester6412
    @deanwichester6412 ปีที่แล้ว

    Если мы присваиваем что-то elem.className, то это заменяет всю строку с классами. Иногда это то, что нам нужно, но часто мы хотим добавить/удалить один класс./На learn js так написано

  • @rssreader90
    @rssreader90 3 ปีที่แล้ว

    Спасибо, то что искал

  • @Theonelasthero
    @Theonelasthero 4 ปีที่แล้ว +3

    Почему-то ваш способ не работает. У меня JS не воспринимает двоеточия и скобки, указывая на ошибку синтаксиса, хотя я все точно так же прописал и проверил.

  • @dedlive51
    @dedlive51 3 ปีที่แล้ว

    Спасибо за видео.
    07:16 document.querySelector(selectors: '.list')
    не оч понятно, selectors: - это плагин какой-то Вам добавил?
    document.querySelector('.list') же вроде надо? Непонятно.

    • @ЕвгенийГизей-ш8ю
      @ЕвгенийГизей-ш8ю 3 ปีที่แล้ว +1

      это VS code автоматом подставляет, это просто подсказка - не является частью кода

  • @cy66a
    @cy66a 4 ปีที่แล้ว

    Краткая запись в Emmet:
    ul.list>li.item{Item $}*4
    то же самое, что:

    Item 1
    Item 2
    Item 3
    Item 4

  • @ViKiNG_89
    @ViKiNG_89 4 ปีที่แล้ว +2

    Привет) спасибо за видео, а что за расширение стоит, которое подсвечивает селектор? 6:07

    • @centradude493
      @centradude493 4 ปีที่แล้ว +1

      JS Parameter Annotations --- ctrl+c)))

    • @ViKiNG_89
      @ViKiNG_89 4 ปีที่แล้ว +1

      @@centradude493 Спасибо

    • @владимирарутнки
      @владимирарутнки 2 ปีที่แล้ว

      @@centradude493 что-то не работает он

  • @AltynnikovAE
    @AltynnikovAE 3 ปีที่แล้ว

    спасибо

  • @ТатьянаЛ-л9э
    @ТатьянаЛ-л9э 3 ปีที่แล้ว

    Спасибо большое!!!

  • @ИгорьМалежик-е3з
    @ИгорьМалежик-е3з 3 ปีที่แล้ว

    Спасибо, помог.

  • @Minipro12345
    @Minipro12345 ปีที่แล้ว

    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

  • @МихаилП-о6ш
    @МихаилП-о6ш 7 หลายเดือนก่อน

    в 2024 году твой код не работает в курсе ?

  • @АлександрГурьев-й9ф
    @АлександрГурьев-й9ф 4 ปีที่แล้ว

    Всё очень здорово. Спасибо!
    Но про className так не чего и не услышал.

    • @MarioDev
      @MarioDev  4 ปีที่แล้ว +3

      className просто читает класс элемента и так же перезаписывает его например document.body.className = 'wrap', у className есть старший брат, classList, лучше пользоваться им, тоже самое будет document.body.classList.add('wrap'), но у classList есть много других методов например toggle, remove, и другие

    • @АлександрГурьев-й9ф
      @АлександрГурьев-й9ф 4 ปีที่แล้ว +1

      @@MarioDev Спасибо. Про читал уже про это свойства.

  • @tontontonic
    @tontontonic 3 ปีที่แล้ว

    у меня вопрос, допустим я скачал коллекцию анимаций, подключил этот файл и анимацию к элементу по классу()она работает - элемент анимирован, но если я этот же класс анимации добавляю к элементу через JS класслист.тоглкласс, то он не анимируется, почему??? класс подключается, в консоли это видно, но анимация не происходит

    • @MarioDev
      @MarioDev  3 ปีที่แล้ว

      скинь код

    • @tontontonic
      @tontontonic 3 ปีที่แล้ว

      @@MarioDev спс, я уже разобрался с проблемой)

  • @blackmulthumor
    @blackmulthumor 3 ปีที่แล้ว

    Спасибо большое. А как сделать чтобы при нажатии на один элемент из ul, у остальных удалялись классы? У нажатого появлялся, а у остальных удалялся

    • @MarioDev
      @MarioDev  3 ปีที่แล้ว +1

      у всего списка в цикле удаляешь класс active, у нажатого элемента добавляешь

    • @aramas36
      @aramas36 3 ปีที่แล้ว

      @@MarioDev извините, а можно пример?

  • @googoogle
    @googoogle 3 ปีที่แล้ว

    почему у меня тогл не работает? то есть класс просто добавляется и все.
    const iconMenu = document.querySelector('.menu__icon');
    const menuBody = document.querySelector('.menu__body');
    iconMenu.addEventListener("click", function (e) {
    menuBody.classList.toggle('_active');
    });

    • @googoogle
      @googoogle 3 ปีที่แล้ว

      разобрался. .menu__body _active перекрывал иконку). видео крутое. подписался

  • @german_ny
    @german_ny 4 ปีที่แล้ว

    Текст мелкий. С телефона особенно код плохо видно.

  • @andreweb3087
    @andreweb3087 4 ปีที่แล้ว +1

    Спасибо за уроки, не подскажите почему выдает ошибку "Uncaught SyntaxError missing ) after argument list" Код проверил все так же как у вас ссылка на скрин prnt.sc/ut2uwo

    • @0211-g1i
      @0211-g1i 2 ปีที่แล้ว

      тоже самое

  • @АнтонКамаргин-ъ6ъ
    @АнтонКамаргин-ъ6ъ 4 ปีที่แล้ว

    +++